inline style css only works

Question

i'm tring to make something looks good

i was tring to use css but i got a problem

only a inline style is working...

reply new {
        display: inline-block;
        height: 5vh;
    }
    reply new writer {
        width: 20px;
    }
    reply new content {
        width: 20px;
    }

<input type="text" class="reply new writer form-control input-sm" style="width: 20px">
<input type="text" class="reply new content form-control input-sm">

it doesn't work.

but

<input type="text" class="reply new writer form-control input-sm" style="width: 20px">
<input type="text" class="reply new content form-control input-sm">

it works.

what should i do

Answer 1

reply new

This is a type selector, followed by a descendant combinator, followed by another type selector. It will match:

<reply><new></new></reply>

… which is not valid HTML.

---

To select an element based on a class you need to use a class selector, which starts with a ..

To select an element based on multiple features, you need to combine them directly without putting descendant combinators between them.

.reply.new {
    ...
}