5.5. Basic Three-Column Layout

The sample site for this book, Footbag Freaks, uses a combination of a three-column layout with a header at the top and a footer at the bottom. This is a classic Web page design. Some have even called it "the Holy Grail" when it includes a fluid center column. The first place I saw this reference was on Eric Costello's Website, http://www.glish.com/.

To understand the CSS involved in creating this basic page layout, let's start by looking at the core code for building a three-column layout with a mixture of fixed and flexible column widths, commonly known as fluid layout (see the sidebar below for details). Then, we'll add the top-level header area, and a footer. In Chapter 6, we'll learn a few more advanced ...

Get HTML Utopia: Designing Without Tables Using CSS now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.