WEB STANDARDS CREATIVITY

60
For more information about hasLayout, read Ingo Chao’s excellent article on the topic: www.satzansatz.de/
cssd/onhavinglayout.html. Of course, doing so is likely to make your eyes cross and/or your hair fall out, so
maybe it’s best if you take the whole thing on faith.
To trigger hasLayout in older versions of IE/Windows, let’s add the following rule to our patches-win.iex.css file:
#content-layout {
height: 1%;
}
And finally, let’s crack open our patches-mac.ie5.css file and add this:
#content-layout {
display: inline-table;
}
As the French designers say, le voilà—Figure 3-6 shows us that our floats have once again been contained, and our borders
are standing strong, gray, and proud.
Figure 3-6. With some clearing implemented, our border’s back again.
I never said I was good at this whole “metaphor” thing. Moving along.
Getting column-tastic (finally)
Now that our container is back on track, all we need to do to create our two-column effect is to apply the appropriate
margins to our divs: a negative right margin to content-primary-wrap and a right margin to content-primary. The values
used in these margins should be equal to, or larger than, the width of content-secondary, which we’ll now set.