BODY {background-image: url(bg23.gif);
background-repeat: no-repeat;
background-position: 20px 30px;}
Figure 6-43

Figure 6-43. Offsetting the background image using length measures

This is, of course, different than percentage values, in the sense that the offset is simply from one top left corner to another. In other words, the top left corner of the background image lines up with the point specified in the background-position declaration. You can combine Tuesday 31st of March 2015 05:26:58 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

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

DIV {border: 1px solid black;}P.neg {margin-bottom: -50px; width: auto; margin-right: 10px;margin-left: 10px; border: 3px solid gray;}<DIV STYLE="width: 420px; background-color: silver;padding: 10px; margin-top: 75px;"><P CLASS="neg">A paragraph.</P></DIV>
explicitly declare to be 14px:

P {line-height: 14px;}IMG.up {vertical-align: 50%;}<P>Some <IMG SRC="tall.gif" alt="tall image"><IMG SRC="short.gif" CLASS="up" ALT="short image"> text.</P>
Figure 4-43

Figure 4-43. Vertical alignment with percentage and two images

The bottom (or baseline) of the smaller image is raised by one-half(50%) of the line-height, or 7pixels. If we had set the alignment for IMG.up to content edge of the ancestor. In left-to-right languages, the top andleft of the containing block are the top and left content edges ofthe first box in the ancestor, and the bottom and right edges are thebottom and right content edges of the last box. In right-to-leftlanguages, the right edge of the containing block corresponds to theright content edge of the first box, and the left is taken from thelast box. The top and bottom are the same.

If there is no such ancestor, then the content edge of the root