Learning how to use the full range of CSS selectors available in CSS 2.1 properly can actually help you keep your HTML a lot cleaner. It will let you minimise unnecessary use of the class attribute and the need for adding extraneous div and span elements to the markup. Sounds good, right?
I’m going to describe all the selectors later on, so things will definitely get a bit trickier. Before that though, here is an overview of the syntax for all CSS 2.1 selectors.
The default text size is a good starting point, but for most people (designers, clients, and their customers) 16px is too large for body text. In our example, the body text was reduced to 12px (pixels).
.text p { font-size:14px; }The result show that Safari and Firefox still resize the text, but IE6 and IE7 do not. In Opera and IE7 the text can be resized by using the page zoom tool, which magnifies the page layout, text and images within.
In this example we will use ems to size the text. The em is a true typographic unit, recommended by the W3C, and affords a precision keywords lack. Working from a default of 16px, the following styles should give the desired text sizes:
