LAYOUTS - CSS: Professional Techniques for Modern Layout - page 134

As before, we'll put the i rst column in the middle. In this case, we'll put column two on the
let and column three on the right. h ese columns need to have a i xed width—that is, one not
based on percentages. (If we wanted all the columns to be percentage-based, we'd just use the
original One True Layout discussed in the preceding section.) We could use pixels, but let's
spice things up a bit with ems. We'll make the second column 13em wide, and the third 15em
wide.
Okay, so that's 13em on the let and 15em on the right (see Figure 4-29). First, style the
container
.contain { padding : 0 15em 0 13em ;}
136
Figure 4-29: Setting up the necessary padding.
Now start l oating the columns and pulling them into their intended slots. h is i lls up the
container's content area with the i rst (center) column:
.column { float : left ; position : relative ;}
.one { width : 100% ;}