Book Home Wednesday 23rd of August 2017 07:22:03 PM Cascading Style Sheets: The Definitive GuideSearch this book

Full Text Search

If you are having difficulty searching, or if you have not used this search utility before, please read this.


Library Navigation Links

Example

EM {font-style: oblique;}
This is used to set the weight of a font, making it heavier or lighter. The numeric value 400 is equivalent to the value normal, and 700 is equal to bold. Each numeric value is at least as heavy as the next-lower value, and at least as light as the next-higher number.

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

In case you're wondering, under CSS1, there is no way to directly set the style for only a single side using something like border-top-style, since no such property exists in CSS1 (although that property, and others like it, were introduced in CSS2). You can, however, sneak around this limitation by declaring the style for a given border using one of the shorthand properties we'll discuss later in the chapter.

line-height. In other words, if aSPAN element has a font-size of12pt and a line-height of36pt, its content area is 12pthigh, and the content area is what will be surrounded with theborder.

This behavior can be altered by assigning padding to the inlineelement, which will push the borders away from the text itself (shownin Figure 8-58):element is not necessarily its parent element. In fact, it often is not, unless the author takes steps to correct this situation. Fortunately, that's easy to do. Just pick the element that you want to use as the containing block for the absolutely positioned element, and give it a position of relative with no offsets. Thus:

P.contain {position: relative;}

Consider the example in Figure 9-19. It shows two paragraphs that contain identical text. However, the first paragraphcircumvent this problem, although two possible approaches aredetailed in Chapter 11, "CSS in Action".

Figure 7-27

Figure 7-27. Overlapping text in Explorer

It gets worse, unfortunately. If you apply margins to inlineelements, as was discussed previously, you'll get results fromNavigator 4.x like those shown in Figure 7-28.

Figure 7-28

Figure 7-28. Margins, inline elements, and Navigator 4.x

The style used to generate Figure 7-28 was as