Sunday 18th of March 2018 02:58:56 AM

Book Home

Cascading Style Sheets: The Definitive GuideSearch this book

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 interesting part will be recreating the way they hang out into theblank space to the left of the column.

If we just give these pictures the style float:left, they'll be completely contained withinthe column. However, since the first column has a left margin, all wehave to do is give images a negative margin-left,like this:

IMG {float: left; margin-left: -2.5em;}
| Y | Z

Index: Y

There are no index entries for this letter.

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.

must equal 400 pixels, and no padding or borders are set, and the right margin and width are set to 100px while the left margin is set to auto, then the left margin will be 200 pixels wide:

P {margin-left: auto; margin-right: 100px; width: 100px;} 

The results are shown in Figure 8-11.

Figure 8-11

Figure 8-11. Automatic left margin

In a sense, auto can be used to say, "make up the difference between everything else and the required complicated. As it turns out, the complication is that margins can have negative values.

You'll remember that I said the second-simplest rule of horizontal formatting was this: the total of the seven horizontal properties always equals the width of the parent element. At first glance, this can be interpreted to mean that an element can never be wider than its parent's content area -- and as long as all properties are zero or greater, that's quite true. However, consider the following, depicted in blind copies. Navigator handles any one of these options; Explorercan handle all three.Here's a link to my e-mail: so you can complain about this page.  The link encloses both the image(with default border) and the blue underlined text.  Note that I specifiedthe text for the subject line (the sender can change this). I could alsospecify ?cc= or ?bcc= and list e-mails to receive copies or blind copies.Navigator handles any one of these options; Explorer can handleall three.