Book HomeCascading Style Sheets: The Definitive GuideSearch this book Sunday 25th of February 2018 10:27:45 PM

2.10. Summary

By using selectors based on the document's language, authors can create CSS rules that apply to a large number of similar elements The University of Delaware<A HREF="">
Spatial Analysis Lab</A>, is a proud sponsor of thiswebsite.
  The animated GIF image is also a link.  Bydefault, a linked image has a 2-pixel wide blue border, but I suppressedthat with the BORDER=0 attribute in the IMG tag.<A HREF="">
<IMG ALIGN=RIGHT HEIGHT=42 WIDTH=39 HSPACE=5 VSPACE=5 BORDER=0 just as easily as they can construct rules that apply in very narrow circumstances. The ability to group together both selectors and declarations keeps style sheets compact and flexible, which incidentally leads to smaller file sizes and faster download times. Thanks to inheritance and the cascade, authors are able to create sets of interlocking rules which, taken together, result in sophisticated document styles. This is all thanks to the fact that CSS is very deeply bound to the structure of documents, and that it uses this structure to determine how rules are applied, which rules should apply, and what elements should assume styles from their ancestors.

Selectors are the one thing that user agents almost have to get right, because the inability to correctly interpret selectors pretty much prevents a user agent from using CSS. However, the cascade and inheritance are different stories, and there have been some flaws in how they're implemented. Navigator 4.x, for example, has a rough time with inheritance into tables, as well as other structures such as lists. You can clear up many of these problems by using very strictly correct HTML, but not all of them.

There are many CSS rules describing lengths, colors, or other things that can be expressed using specific units and values -- and this is the subject (and title) of the next chapter.

Library Navigation Links

Copyright © 2002 O'Reilly & Associates. All rights reserved.

face exists, but there is no defined Oblique face -- the user agent may not substitute the former for the latter, according to the CSS specification. Finally, the user agent can simply generate the oblique face by computing a slanted version of the upright font. In fact, this is what most often happens in a digital world, where it's fairly easy to slant a font using a simple computation.

Furthermore, you may find that in some operating systems, a given font that has been declared to be italic may switch from being italic to oblique depending on the actual size offloated so far up that it intrudes into a paragraph that has alreadybeen displayed by the user agent.

In this case, it's up to the user agent, but the CSSspecifications explicitly state that user agents are not required toreflow previous content to accommodate things that happen later inthe document. In other words, if an image is floated up into aprevious paragraph, it may simply overwrite whatever was alreadythere. On the other hand, the user agent may handle the situation byflowing content around the float, even though doing so isn'tin early CSS implementations, so I've chosen to useSPAN in this case study instead of something alittle more structured.

Having done this, we need a style declaration that will recreate theeffects of all the tags we just deleted. This should just about dothe trick:

.sidebar .head {font-size: larger; font-weight: bold;

Figure 8-31

Figure 8-31. Keeping floats from overlapping

The advantage of this rule is that, since you don't have toworry about one floated element obscuring another, you can be assuredthat all of your floated content will be visible. This makes floatinga fairly safe thing to do. The situation is markedly different whenusing positioning, where it is very easy to cause elements tooverwrite one another.

3. The right outer edge of a left-floating element may not