Descendant selectors in CSS allow you to define styles on elements that are located in specific locations in the XHTML document tree. These selectors are defined as patterns, so that you can define child elements, grandchild, and so on.
Define a descendant selector by separating the relevant elements with a space:
div p { background-color : #ccc; }
This will impact all p elements that are within a div element. But p elements that are within the body of the document would not be affected.
You can also use patterns to define your selectors:
div * em { background-color : #ccf; }
This will affect all em elements that are grandchildren of a div element. In other words, any em that is two elements below the div. For example:
<div><p><em>This one is</em></p> <em>This one isn't</em></div>
Browser Support
The descendant selector with patterns does not work in Netscape 4 or IE 4 Windows and IE 5 (Macintosh).
