tags:

views:

30

answers:

1
.features img{...}

I understand .features is custom CSS class and div is HTML element. But I don't understand what kind of relationship this syntax will build between them?

+3  A: 

This syntax doesn't build any relationship between the .features class and a div.

The style that you provided is styling any child <img> tag contained within a .features class.

Both of these would be valid and apply the given style to the image:

<div class="features">
    <img src="myImg.png" />
</div>

and

<table class="features">
    <tr>
        <td><img src="myImg.png" /></td>
    </tr>
</table>

If you wanted to specify that your class was only applicable to divs, you would need to change the declaration to:

div.features img { }
Justin Niessner
This syntax defines scope in other words, for the element specified at the end of this definition. Can I have nested scope definition or it's limited only by two items?
Michael
You can increase the scope how you wish: `div.features div span a img` would select an image inside an `<a>` tag in a nested div within a div with the class features. There are no limits :)
Kyle Sevenoaks
You can definitely nest them. One extremely common use of nesting is styling menus that are driven by an unordered list.
Justin Niessner