Book HomeCascading Style Sheets: The Definitive GuideSearch this book Sunday 02nd of August 2015 12:09:44 AM

0.3. How to Contact Us

We have tested and verified the information in this book to the best of our ability, but you may find that features have changed (or even that we have made mistakes!). Please let us know about any errors you find, as well as your suggestions for future editions, by writing to:

O'Reilly & Associates, Inc.

1005 Gravenstein Highway North

Sebastopol, CA 95472

(800) 998-9938 (in the U.S. or Canada)

(707) 829-0515 (international/local)

(707) 829-0104 (fax)

You can also send us messages electronically. To be put on the mailing list or request a catalog, send email to:

To ask technical questions or comment on the book, send email to:

We have a web site for the book, where we'll list examples, errata, and any plans for future editions. You can access this page at:

For more information about this book and others, see the O'Reilly web site:

11.2.6. The Incredible Shrinking Text!

Here's a fun thing to do: make your document text so small that it can't be read by the human eye. You can do this using completely correct CSS and a bug-free browser. Here's the

Library Navigation Links

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

element is not necessarily its parent element. In fact, it often is not, unless the author takes steps to correct this situation. Fortunately, that's easy to do. Just pick the element that you want to use as the containing block for the absolutely positioned element, and give it a position of relative with no offsets. Thus:

P.contain {position: relative;}

Consider the example in Figure 9-19. It shows two paragraphs that contain identical text. However, the first paragraph

Figure 8-31

Figure 8-31. Keeping floats from overlapping

The advantage of this rule is that, since you don't have to worry about one floated element obscuring another, you can be assured that all of your floated content will be visible. This makes floating a fairly safe thing to do. The situation is markedly different when using positioning, where it is very easy to cause elements to overwrite one another.

3. The right outer edge of a left-floating element may notthe SPAN element. Also, indexing robots won't be able to make any sense of SPAN as a piece of document structure. On the other hand, using SPAN avoids having to cope with a number of bugs in early CSS implementations, so I've chosen to use SPAN in this case study instead of something a little more structured.

Having done this, we need a style declaration that will recreate the We'll start by considering the simple case of a small inlineelement within a single line, as depicted in Figure 7-52.

Figure 7-52

Figure 7-52. An inline element

Here, if we set values for the left or right border, not only willthey be visible, but they'll displace the text around them, aswe see in Figure 7-53:

With borders, just as with margins, the browser's calculationsfor line-breaking are not directly affected by anyboxproperties. The positioned element does not flow around the contentof other elements, nor does their content flow around the positionedelement. This implies that an absolutely positioned element mayoverlap other elements, or be overlapped by them. (We'll seehow you can affect the overlapping order at the end of the chapter.)

Remember that the containing block of an absolutely positionedelement is not necessarily its parent element. In fact, it often isnot, unless the author takes steps to correct this situation.Fortunately, that's easy to do. Just pick the element that you