Once you have created ID elements on your page, you will probably place additional elements in content inside these IDs. Contextual selectors allow you to control elements inside specific IDs.
Let’s say you defined all p tags to be Arial, size 12, black. However, you have a dark blue div (ID = sidebar) to hold navigation and news on the left side of the page, and the paragraphs inside the news box are showing as black text in a blue box – basically unreadable. You can create a style for the following rule:
#sidebar p
The space between #newsBox and p refers to the fact that the paragraph is inside the newsBox. You essentially read the rule backwards from right to left:
- p controls all paragraphs;
- space means inside of;
- #sidebar refers to the div with ID sidebar
Spaces mean something in CSS rules, so be sure to use them in the proper context. Pun intended.
Tags: #, contextual, css, div, rule, selector, space
This entry was posted on Monday, September 14th, 2009 at 7:13 am and is filed under Random Stuff. You can follow any responses to this entry through the RSS 2.0 feed. Responses are currently closed, but you can trackback from your own site.