HTML and CSS Reference
In-Depth Information
Figure 3.10 shows how this looks in a typical browser. Notice how the sec-
ond paragraph, with a
line-height
value of
100%
, has less spacing between the
lines than the irst paragraph, which has a
normal
line height. his is because
normal line height is 1.2 em, or 120 percent of the font size.
Figure 3.10: Paragraphs with varying line heights
he
letter-spacing
property sets the amount of space between letters. he
value of the property can be a length with a units designator or the keyword
normal
or
inherit
. he normal value is equivalent to 0 em. Negative values are
permitted, which has the efect of making the letters look cramped. he
word-
spacing
property similarly sets the spacing between words and takes the same
values as the
letter-spacing
property. However, the distinction of what is
and what is not a word can be browser- and language-dependent. As with the
letter-spacing
property, 0 is equivalent to normal.
Example 3.11 has code for three paragraphs with diferent letter spac-
ing. I've used the Verdana font for the text because it already has a generous
amount of width in the characters. It uses the same Latin nonsense as Exam-
ple 3.10, but, as you can see in Figure 3.11, the efect is quite diferent.
Example 3.11: Letter spacing and word spacing
<!DOCTYPE html>
<html>
<head>
