O'Reilly logo

Coding All-in-One For Dummies by Nikhil Abraham

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Chapter 5

Building Floating Page Layouts

IN THIS CHAPTER

check Creating a classic two-column page

check Creating a page-design diagram

check Using temporary background colors

check Creating fluid layouts and three-column layouts

check Working with and centering fixed-width layouts

“Perfection of planned layout is achieved only by institutions on the point of collapse.”

— C. NORTHCOTE PARKINSON

The floating layout technique provides a good alternative to tables, frames, and other layout tricks formerly used. You can build many elegant multicolumn page layouts with ordinary HTML and CSS styles.

Creating a Basic Two-Column Design

Many pages today use a two-column design with a header and footer. Such a page is quite easy to build with the techniques you read about in this chapter.

Designing the page

It's best to do your basic design work on paper, not on the computer. Here's my original sketch in Figure 5-1.

FIGURE 5-1: This is a very standard two-column style.

Draw the sketch first so you have some idea ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required