Wednesday 23rd of August 2017 07:24: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: O

oblique text: 5.4.1. Fonts with Style
octothorpe (#) preceding ID selectors: 2.3.2. ID Selectors
offsets (see side-offset properties)
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: Length values
origin sorting: 2.8. The Cascade

Not only that, but if you're using lengths or percentages, youcan give negative values, thus pushing the image out of the element,to some degree. Consider the example with the very large yin-yangsymbol for a background. At one point, we centered it, but what if weonly want part of it visible in the top left corner of the containingelement? No problem, at least in theory. First, assume the image is300 pixels tall by 300 pixels wide. Then, assume that only the bottomright third of it should be visible. We can get the desired effect(shown in Figure 6-45) like this:

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: Overflow clipping
overflow clipping: Overflow clipping
overflow property: Overflow
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.

<NOBR></NOBR> tag and then insert <BR> tags to specify exactly where you do want the line breaks to occur.  You can also include <WBR> tags to indicate where optional line breaks may occur if the line extends beyond the right edge of the browser window. 

The preferred way to control text alignment is by including an ALIGN attribute in a block-level tag such as a paragraph <P ALIGN="left">, headline, e.g., <H2 ALIGN="center"> or page division <DIV

Figure 6-13

Figure 6-13. Using classes to apply styles to different INPUT elements

In CSS2, it's a little easier to distinguish between different elements based on what attributes they have. As an example, the rules shown here will match the following two INPUT tags, respectively:

INPUT[type="radio"] {color: #333333;}
INPUT[type="checkbox"] {color: #666666;}
<INPUT TYPE="radio" NAME="r2" VALUE="A ">
<INPUT TYPE="checkbox" NAME="c3" VALUE="one ">
BODY {background: silver;}
P {background-color: gray; padding: 1px; border: 0.1px solid gray;}

It is necessary to set a border-style for this technique to work. Whether you use that specific property, or simply a value of the border property, doesn't really matter.

Of course, by doing this, you're setting a border on the element, and that border will show up in other user agents as well. And, just to top things off, Navigator doesn't handle paddingrecommended.

margin-topIE4 P/P IE5 P/Y NN4 P/P Op3 Y/-

This sets the size of the top margin ofan element. Negative values are permitted, but caution isrecommended.


paddingIE4 P/P IE5 P/Y NN4 B/B Op3 B/-

This setsthe size of the overall padding of an element. The padding will"inherit" the element's background; in other words,