Tuesday 31st of March 2015 08:38:35 AM

Book Home

Cascading Style Sheets: The Definitive GuideSearch this book


effect, this declaration will work just fine. Figure 11-9 reveals the result.

Figure 11-9

Figure 11-9. Floating images

As you can see, the first column is now quite a bit longer than thesecond. However, since we haven't done much of anything to thesecond column, let's leave things as they are for the moment.

An offset block of text showing a quotation in a larger size isusually called a "pull quote." We have one near themiddle of the second column, so let's decide how that will be

Symbols | A | B | C | D | E | F | G | H | I | J | K | L | M | N | O | P | Q | R | S | T | U | V | W | X | Y | Z

Library Navigation Links

Copyright © 2002 O'Reilly & Associates, Inc. All Rights Reserved.

changed to reflect implementation. This means, sadly, that it is impossible to set a consistent clipping rectangle in situations where the height and width are not precisely defined. For example, there is no way to create a clipping rectangle that is 1 em larger than this element's content area:

position: absolute; top: 0; bottom: 50%; right: 50%; left: 0;

Since there is no way to know how many ems tall or wide the element will be, there is no way to make a clipping rectangle that ends 1 em to the right, or 1 em below, the content area of the element.layout. This was discussed in the previous chapter, using this example:

LI {margin-top: 10px; margin-bottom: 20px;}

Padding and borders, where they exist, are never collapsed. If neither is declared, then both will default to 0 (zero). This assumes that no style is set for the border. If a border style is set, then the value of border-width defaults to medium , not zero. The exact width of medium will depend on the user agent'sline-height of any value -- be it 0.25em or 25in -- makes no difference without inline content to take advantage of it.

In a certain sense, then, each line of text contained within a block-level element is its own inline element, even though it isn't surrounded by any tags. If you like, picture a fictional tag sequence something like this: