What is the difference between these two classes

Question

I don't know how they are different in css

something
{
   //some properties
}

something >.somethingelse
{
   // something else's properties
}

and

something
{
   //some properties
}

something .somethingelse
{
   // something else's properties
}

I don't know why there is such a > in the second case. Should there also be a < for use too ?

Answer 1

The > indicates that direct children somethingelse are found under something. Otherwise descendants will be found at all levels.

So using this following example:

<div class="something">
    <div class="somethingelse">
        <div class="somethingelse">
        </div>
    </div>
</div>

For the > example only the outer somethingelse div will take effect. For the example without > both divs will have the style applied.

< might imply a parent selector (ie apply a style to the direct parent of a matching class). I'm not aware of this existing yet, but theres an interesting post on it a csstricks here.

Answer 2

The > selects any element with the class .somethingelse which is a child of an element with the class .something.

The second CSS selector will select any descendents of the element with the class .something. I.e. the children, and the childrens children, and so on.