Sunday 25th of September 2016 12:32:00 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: Z

z-axis: 9.5. Stacking Positioned Elements
z-index property: 9.5. Stacking Positioned Elements

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.

To understand why, let's go back to the paper-and-plasticanalogy employed in the previous section. Think of an inline elementas a strip of paper with marginal plastic surrounding it. Displayingthe inline element on multiple lines is like cutting up the stripinto smaller strips. However, no extra plastic is added to eachsmaller strip. The only plastic used is that which was on the stripto begin with, so it only appears at the beginning and end of theinline element.

  • If the ancestor is inline-level, the containing block is set to the content edge of the ancestor. In left-to-right languages, the top and left of the containing block are the top and left content edges of the first box in the ancestor, and the bottom and right edges are the bottom and right content edges of the last box. In right-to-left languages, the right edge of the containing block corresponds to the right content edge of the first box, and the left is taken from the last box. The top and bottom are the same.

    switch from being italic to oblique depending on the actual size ofthe font. The display of Times on a Macintosh, for example, is asshown in
    Figure 5-27, and the only difference thereis a single point in size.

    Figure 5-27

    Figure 5-27. Same font, same style, different sizes

    There isn't much that can be done about this, unfortunately,save better font handling by operating systems. Usually, the italicand oblique fonts look exactly the same in web browsers.

    setting a line-height for theBIG element, the overall height of the line boxhas been increased, thus providing enough room for theBIG element to be displayed without overlappingany other text and without changing theline-height of all lines in the paragraph. We usea value 1em so that theline-height for the BIG elementwill be set to the same size as BIG'sfont-size -- remember, the grandchild of the BODY element. The firstEM is not matched because its grandparentOL is not the direct child of aDIV.

    Even better, you can string more than one child selector together toprecisely target a given type of element. Take this, for example:

    Figure 10-4

    Figure 10-4. Selecting grandchildren only

    The first list item in the source is silver because it's the