Notice that the headline in Figure 12-10 is tightened up, by removing space
between both the letters themselves, as well as between the lines. These
useful techniques contribute to an attractive Web page and are discussed in
detail in Chapter 7:
font: bold 48px/.99 “Arial Black”; letter-spacing: -.06em;
Figure 12-11 shows the same page as Figure 12-10, but the browser has
been resized. Notice that the internal design — the size and position of
the elements — has remained stable and fixed.
Creating Columns that Resize with the Browser .....................................
Of course, the free-form designs demonstrated in the previous examples
aren’t appropriate for every Web site. In fact, most businesses continue to
prefer the more staid, often more text-intensive, classic grid layout that
tables have been supporting for so long in Web pages.
Figure 12-11:
No matter
what the
aspect ratio
of the
containing
browser,
these
various text
blocks
remain
in position.
224 Part III: Adding Artistry: Design and Composition with CSS
