<html>
<head>
<style>
body {font-size: 26px;}
p {font-size: 1.5em;}
p.abs {font-size: 39px;}
</style>
</head>
<body>
some text
<p>
some text (1.5 em of the parent body).
</p>
<p class=”abs”>
some text (39 pixels).
</p>
</body>
</html>
The text in the absclass version of <p>is rendered the same size as the ordi-
nary <p>. The <body>element is a parent element of the <p>, and <p>is
defined as 1.5emof its parent. The parent body uses 26 pixels as its text size,
so 26x1.5 results in 39 pixels. You can see the effect of the relativity between
em and its parent <body>element in Figure 6-1:
Figure 6-1:
The second
line —
a child
element
set to
1.5em—
is therefore
1.5 times
the size of
the first line.
110 Part II: Looking Good with CSS
