Thursday 18th of September 2014 03:35:57 AM

by Eric A. Meyer
ISBN 1-56592-622-6
First edition, published May 2000.
(See the catalog page for this book.)

Search the text of Cascading Style Sheets: The Definitive Guide.

Table of Contents

Copyright Page
Chapter 1: HTML and CSS
Chapter 2: Selectors and Structure
Chapter 3: Units and Values
Chapter 4: Text Properties
Chapter 5: Fonts
Chapter 6: Colors and Backgrounds
Chapter 7: Boxes and Borders
Chapter 8: Visual Formatting
Chapter 9: Positioning
Chapter 10: CSS2: A Look Ahead
trivial matter to calculate the height of the element based on its content. If width has also been set to auto, then the user agent would have had to assign some value to it. This value is likely to vary by user agent, so it's usually better to declare a width that you like.

Of course, this is not always the case: you could set an explicit height and let the width scale to fit the content. Thus:

top: 0; bottom: auto; left: auto; right: 0; width: auto; height: 10em;
Chapter 11: CSS in Action
Appendix A: CSS Resources
Appendix B: HTML 2.0 Style Sheet
Appendix C: CSS1 Properties
Appendix D: CSS Support Chart
Library Navigation Links

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

works out such that the specification isn't violated. A similarline of reasoning explains how the left inner edge of the floatedelement can be placed to the left of the left inner edge of itsparent.

Many of you may have an overwhelming desire to cry"Foul!" right about now. Personally, I don't blameyou. It seems completely wrong to allow the top inner edge to behigher than the top outer edge, for example, but with a negative topmargin, that's exactly what you get -- just as negative Backgrounds and floats

There are many other interesting effects associated with floating elements. Take the example of a short document, composed of no more than a few paragraphs and H3 elements, where the first paragraph contains a floated image. Further, this floated image has a right margin of five pixels (5px). You would expect the document to be rendered very much as shown in Figure 7-67.

Figure 7-67

Figure 7-67. Floating an image

particular has been set so that it does permit floated elements on either side:

H2 {clear: both;}
<H2 STYLE="clear: none;">Not Cleared!</H2>
Figure 7-78

Figure 7-78. Not clear at all

clear works by increasing the top margin of an element so that it ends up below a floated element, so any margin width set for the top of a cleared element should be effectively ignored. That is, instead of being 1.5em , for