Introduction

One of the last frontiers in creating a
truly CSS-enabled presentation is the layout. For a long time, web
developers have been using HTML tables to create their layouts,
often nesting tables to create multicolumn, multilevel layouts.
Nested HTML tables render well in older browsers like Netscape
Navigator 4 where CSS support, if present, is barely noticeable and
is mostly wrong. If your audience uses an older browser and visual
presentation is a key component of the site's
success, you should consider using HTML tables.

However, if your audience uses a browser that supports CSS, you
should use CSS to design your layouts. As a design language, CSS is
focused on presentation, which includes helping web developers
control the layout of their pages. HTML tables and other HTML
elements, on the other hand, are tools you use to mark up content.
The ideal is to have HTML represent the structure of the content at
an intellectual abstract level and CSS say how to present it for a
particular device.

Furthermore, with CSS you diminish file sizes and maintenance
headaches. For example, by stripping away presentational markup and
moving a design to CSS, you can reduce the file size of a web page
tremendously. And once the design is in CSS syntax, creating
site-wide changes becomes a snap.

This chapter discusses the many ways in which you can create column
layouts—including simple one-column layouts, four-column
layouts, and everything in between. It also explains how to start
working with CSS if you still need to build a site using HTML tables
and you want to use CSS just to help with the layout chores.