HTML and CSS Reference
In-Depth Information
div#content {
width: 600px;
}
div#content p {
max-width: 450px;
}
Figure 9-21.
The containing
div
is 600 pixels wide, but the text is only 450 pixels long, thanks to
the
max-width
property.
■
Note
Internet Explorer 6 and lower do not properly support
mix-width
and
max-width
. When these
properties are used, IE will interpret them as the
width
property.
Leading (or line-height)
Leading (rhymes with “bedding”) refers to the amount of space between lines of type. The
name comes from traditional letterpress-style typesetting, in which strips of lead or other
metal are used to separate one line of text from the next.
In CSS, this space is defined using the
line-height
property. For example:
p {
font-size: 10px;
line-height: 14px;
}
In this case, the type's em square will be 10 pixels tall, but 2 pixels of extra space (or leading)
will be added above and below each line. Typographers refers to this as text being set
10 over 14
,
or
10/14
. Note that you can also have negative leading:
p {
font-size: 10px;
line-height: 8px;
}
Here, the text is set 10/8. Depending on the nature of the typeface, this may cause charac-
ters to overlap one another vertically. Negative leading is sometimes used in short bursts of
text such as ad copy or headers, but is rarely useful in blocks of text. Adding positive leading is
one of the single most effective ways to increase readability of your site's body text. Although
