untitled

(John Hannent) #1
possible helps. This way, you get the most predictable proportions on most
browsers. Here are the CSS values you can specify for the font-sizeprop-
erty: xx-small, x-small, small, medium,large, x-large, xx-large,
smaller, larger, length, percentage, inherit.

One way to indicate a size relative to the parent element is to use the values
smalleror larger, like this:

<html>
<head>

<style>

body {font-size: x-large;}

p {font-size: smaller;}

div {font-size: larger;}

</style>
</head>

<body>

This is the body text

<p>
This is one step smaller than its parent body.
</p>

<div>
This is one step larger than the parent.
</div>

</body>
</html>

Load this example into IE and you see results like those shown in Figure 5-8.

The xx-largevalue is the largest value in the list of possible CSS text size
values. However, if you then apply the largervalue to a child element within
xx-largetext, IE follows your request and goes beyond xx-large.

Controlling font size with greater precision ....................................


If you want to try for a bit more precision than “smaller” or “larger” but still
avoid specifying absolute points or pixels, use percentages. For example, to
make a paragraph font 75 percent the size of its parent div, try this:

98 Part II: Looking Good with CSS

Free download pdf