Download 9 Page Layout

Page Layout
Figure 9-1:
CSS Zen Garden (www.csszengarden.com) is the
original (and still best) showcase for CSS layout. It
has caused many a Web designer to bow down and
proclaim, “I’m not worthy. I’m not worthy.” The site is
interesting not only for the great design work it
showcases, but because each page includes the
same content, but is formatted in radically different
ways using CSS. The exact same HTML is shared by
these three pages—only the external style sheet and
graphics used in the style sheet differ. Making drastic
visual changes to a table-based layout requires a lot
of tinkering with the underlying HTML. CSS, by
contrast, lets you redesign sites without rewriting any
HTML.
Note: CSS Layout is one of those complex topics that is sometimes better learned by doing instead of
reading. To get a taste of how CSS Layout works, try the tutorial on page 351 first, then flip back to the
beginning of this chapter for all the messy details.
This chapter introduces the basic concepts behind float-based layouts—what they are,
how they work, and how to create one; it also provides instructions for modifying
Dreamweaver’s CSS designs. In addition, you’ll learn about absolute positioning, and
how to use it for placing selected elements where you want them on a Web page.
310
Dreamweaver CS3: The Missing Manual