CSS selector for class descendant within a class

Question

Is it possible to create a CSS selector for \'element with class b, which is a descendant of an element with class a\'?

Thanks, Rasto

Answer 1

Yes it is possible:

Direct Descendants:

.a > .b { /* ... */ }

All Descendants:

.a .b { /* ... */ }

Answer 2

Given the mark-up:

<div class="elementClassA">
    <div class="elementClassB">first B element</div>
</div>
<div class="elementClassA">
    <div class="elementClassC">first C element
        <div class="elementClassB">Second B element</div>
    </div>
</div>​

Yeah, for all descendants:

.elementClassA .elementClassB {
}

The above will target both the first B element and the Second B element: JS Fiddle demo.

For immediate descendants:

.elementClassA > .elementClassB {
}

This will target only the first B element: JS Fiddle demo.

References:

• `CSS Selectors.

Answer 3

For sure, it's a simple CSS selector:

.classA .classB {}