Saturday 25th of October 2014 10:35:21 PM

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 | Y | Z

Index: E

element boxes: 7.1. Basic Element Boxes
8.1. Basic Boxes
element clipping: Element clipping
element selectors: 2.1.1. Rule Structure
classification of: 2.9. Classification of Elements
floated (see floated elements)
overlapping, altering: 9.5. Stacking Positioned Elements
styling common: 11.2.4. Styling Common Elements
visibility of: 9.1.5. Element Visibility
elevation property: 10.8.2. The Spoken Word
em box: 5.3. Font Size
em-height (em): em and ex units
em length value: 5.3.3. Percentages and Sizes
em square: 5.3. Font Size
embedded style sheets: 1.4.2. The STYLE Element
ex-height (ex): em and ex units
Extensible Markup Language (see XML)
external style sheets: 1.4.1. The LINK Tag
creating: 11.1.1. Case 1: Consistent Look and Feel
with @import directive: 1.4.3. The @import Directive
with LINK element: 1.4.1. The LINK Tag
extra space around elements, adding: 7.2. Margins or Padding?
7.2. Margins or Padding?
(see also margins)

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

IMG {vertical-align: 50%;}<P>The image in this paragraph <IMG SRC="test.gif" ALT="test image">will be raised 9px.</P>

The inherited value of line-height is what causesthe image to be raised nine pixels, instead of some other number.Without a value for line-height, it wouldn'tbe possible to perform percentage-value vertical alignments. Theheight of the image itself has no relevance when it comes to verticalalignment: the value of line-height is all thatmatters. Library Navigation Links

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

shouldn't center it. Instead, you should declare:

P {margin-left: auto; margin-right: auto; width: 50%;}

This will center all paragraphs within their parent elements, asshown in Figure 8-15.

Figure 8-15

Figure 8-15. Centering an element with automatic margins


As of this writing, only Internet Explorer 4.5 and 5 for theMacintosh and Opera 3.6 will center elements usinginitial appearance of common sense. They are as follows:

1. The left (or right) outer edge of a floated element maynot be to the left (or right) of the inner edge of its parentelement.

Straightforward enough. The furthest to the left the outer left edgeof a left-floated element may go is the inner left edge of its parentelement; similarly, the furthest right a right-floated element may gois its parent's inner right edge, as shown in Figure 8-30. (In this and subsequent figures, the circled