HTML and CSS Reference
In-Depth Information
If this compounded calculation of the font size is not the desired behav-
ior, it may be more useful to set the font size on some container element
and avoid setting it on list items, paragraphs, or inline elements that
may appear in various locations in the HTML document. For the previous
example, the following would ensure that all items in the outer container
element (
ul
) are half the body size and that this value is not reapplied for
nested lists:
body > ul {
font-size: 0.5em;
}
note
Many screen-based fonts become difficult to read at small sizes where
there may not be enough pixels to distinguish the strokes of a charac-
ter. Be careful when using relative sizes that make the default font size smaller
because some users may have set their default font sizes to something smaller
than you're expecting already. Some browsers allow users to set a minimum
font size to aid the readability of text to prevent it from becoming illegible.
Keeping It Relative
There is an eternal debate among web developers about whether it
is better (more accessible to those with poor eyesight) to use relative
font sizes on a page or whether it is OK to use a fixed-size unit like
pixels. Much of the anti-fixed-size argument is centered on the text-
zoom behavior of Internet Explorer 6 and older in which the browser
will not enlarge fixed-sized fonts.
Even if the base font size you choose is a fixed size (say 12 pixels), it
may be worthwhile to use relative units for any individual element-
specific or section-specific font size changes. Doing this allows for
changing the base font size while maintaining the scale and relative
sizes for headers, block quotes, footnotes, and so on, without the need
to edit each individual
font-size
property throughout the style sheet.
