Question

I have four <div> box each are placed one inside another and first box is define as class="a" and rest are define as class="b" now What I want to do with the help of class="b" I want to set third box background-color:red so How it can be done with only class="b" no different class or id I want.Will it be possible or not?

<div class="A">
<div class="B">
<div class="B">
<div class="B"></div>
    </div>
</div>
</div>

and if the case like this

<div class="A">
    <div class="B"></div>
    <div class="B"></div>
    <div class="B"></div>    

    </div>

Then how can I make third box red with help of class only
JSFIDDLE and
2nd JSFIDDLE
​

Answer 1

Yes it is possible.

Use the CSS Selector this way:

div.B .B .B
{
    background-color:red;
}​

Updated Fiddle: http://jsfiddle.net/yH8e3/3/

For the second case, you need to use :nth-child selector:

.A .B:nth-child(3)
{
    background-color:red;
}​