Wednesday 10th of February 2016 04:01:33 PM

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
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 browser window. This of course assumes that all H1 elements are the child of the BODY element and that BODY is as wide as the browser window. More properly stated, the side margins of H1 elements will be 10% of the width of the H1's parent element.

Let's revisit that example for a moment:

H1 {margin: 0.5em 10% 0.5em 10%;}

Seems a little redundant, doesn't it? After all, you have to

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

7.3.8. Margins: Known Issues

As useful as margins are, a number of problems can arise with theiruse -- enough, in fact, that they warrant their own section,instead of just a small warning box.

The first is that Navigator4.x generally adds margin rules to its built-inmargins, instead of replacing the built-in values. For example,let's say you want to eliminate the space betweenH1 elements and paragraphs. Here's theelements shown will match the preceding rule, whereas the third willnot, as illustrated by Figure 10-7:

P[class="directions"] {color: red;}P.directions {color: red;}DIV[ID="abc123"] {color: blue;}DIV#abc123 {color: blue;}

Obviously, the latter rule in each pair is much simpler to type andedit, and you'll probably use such rules in most circumstances.

There may be times where you want a different amount of space on each side of an element. That's simple as well. If we want all H1 elements to have a top margin of 10 pixels, a right margin of 20 pixels, a bottom margin of 15 pixels, and a left margin of 5 pixels, here's all we need:

H1 {margin: 10px 20px 15px 5px; background-color: silver;}

As Figure 7-8 reveals, we have what we wanted. The order of the values is obviously important, and follows this pattern: