Saturday 01st of November 2014 01:54:05 PM

Book Home

Cascading Style Sheets: The Definitive GuideSearch this book

Symbols | A | B | C | D | E | F | G | H | I | J | K | L shown in Figure 6-40.

Figure 6-40

Figure 6-40. Lining up the center of the image with the center of the browser window

Thus, if you want to place a single background image a third of theway across the element and two-thirds of the way down, then yourdeclaration would be:

BODY {background-image: url(bigyinyang.gif);background-repeat: no-repeat;background-position: 33% 66%;}
|
M | N | O | P | Q | R | S | T | U | V | W | X | Y | Z

Index: O

oblique text: 5.4.1. Fonts with Style
octothorpe (#) preceding ID selectors: 2.3.2. ID Selectors
offsets (see side-offset properties)
Opera
CSS implementation in: 1.3.2. Implementations
padding and: 7.5.4. Padding: Known Issues
padding values, negative: 7.5. Padding
operating system, colors and: 10.5.2. Colors
order sorting: 2.8. The Cascade
ordered lists: 7.7.1. Types of Lists
7.7.2. List Item Images
origin image: 6.2.3.3. Length values
origin sorting: 2.8. The Cascade
origins: 2.8. The Cascade
orphans property: 10.8.1. Paged Media
outline properties: 10.5.3. Outlines
overflow: 9.1.4. Content Overflow and Clipping
overflow-clip property: 9.1.4.2. Overflow clipping
overflow clipping: 9.1.4.2. Overflow clipping
overflow property: 9.1.4.1. Overflow
overlapping
elements, altering: 9.5. Stacking Positioned Elements
floated elements, preventing: 8.3.1. Floating: The Details
margins (see collapsing margins)
text, preventing: 8.4.3. Managing the Line Height of Inline Elements
overlining: 4.1.6. Text Decoration
overriding previously declared values: 11.1.3. Case 3: Putting a Magazine Article Online


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.

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,despite the fact that the ancestor (and possibly the siblings) isinvisible. In order to do so, you would need to explicitly declarethe descendant element to be visible, since

This property accepts as a value any valid color, as discussed in Chapter 3, "Units and Values", such as #FFCC00 or rgb(100%,80%,0%). It has the effect of setting the color of the text in the element, as shown in Figure 6-1:

<P STYLE="color: gray;">This paragraph has a gray foreground.</P>
<P>This paragraph has the default foreground.</P>
Figure 6-1

Figure 6-1. Declared color versus default color

TIP

In Figure 6-1, the default foreground color is

Nonetheless, if you leave out this statement, every version ofNavigator 4.x will not extend the background color throughout theentire content box but will only place it behind the element'stext.

11.2.6. The Incredible Shrinking Text!

be used to your advantage in many circumstances. Take, for example, adocument design in which you want STRONG text tobe gray, except when it follows EM text, in whichcase it should be silver:

Firstoff, there is the ability to create a selector that matches anyelement with the specified attribute. For example, you can match allanchors with a NAME attribute, or allIMG elements with a BORDERbottom edge is not moved up from the bottom. This leads towhat's shown in Figure 9-2.

TIP

What's depicted in Figure 9-2, and in most ofthe examples in this chapter, will only work if the containing blockwas established by an element with an explicitly defined height. Thisis because a line in the specification says that if the height of thecontaining block is not explicitly specified -- say, for example,that it's dependent on the content of the element, as in a