Friday 20th of April 2018 04:40:14 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: 9.1.4.3. Element clipping
element selectors: 2.1.1. Rule Structure
elements
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): 3.2.2.1. 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): 3.2.2.1. 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
loading
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?
the bottom of its parent element. Of course, it did so in the firstexample, but it was less obvious there because we couldn't seethe background then. There is nothing forbidden about this behavior.

WARNING

In practice, some browsers may not do this correctly. Instead, theywill increase the height of a parent element so that the floatedelement is contained within it, even though this results in a greatdeal of extra blank space within the parent element.

(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


Library Navigation Links

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

possible with images and, in some browsers, tables. CSS, on the otherhand, allows any element to float, from images to paragraphs tolists. In CSS, this behavior is accomplished using the propertyfloat.

float

For example, to float an image to the right, you could use thismarkup:

</P>
Figure 9-14

Figure 9-14. Hiding an element

Everything visible about an element -- such as content,background, and borders -- will be made invisible. Note that thespace is still there because the element is still part of thedocument's layout. We just can't see it.

Note too that it's possible to set the descendant element of ahidden element to be visible.This would cause the element to appear wherever it normally would, styles, which have the result shown in Figure 6-6:

P.aside {color: gray; border-style: solid;}
Figure 6-6

Figure 6-6. Border colors are taken from the content's color

This will result in the element <P CLASS="aside"> having gray text and a gray medium-width solid border. That's because the foreground color is applied to the borders by default. The basic way to override that is with the property border-color: