this content does not extend to the bottom of the column
this content does not extend to the bottom of the column
This page uses 1 CSS file that provides basic page layout. It uses the YUI font/reset and then it uses my "ReReset" to provide base HTML typography. Nothing other people haven't done before, this is just the one I did.
The #page width is set using min/max-width (stylesheet). IE6 doesn't understand that, so in a style sheet that is delivered to only IE6 via conditional comment an IE proprietary function is evoked (stylesheet). Basically it's Javascript written inside of CSS, but only IE sees it, so every other browser validates and uses the basic method.
Then to get the columns to line up, the column.js file is attached to the page. This checks for the height of the highest column and makes the other two match. Or as many columns as you specify in the array. It also checks for text resize.
This doesn't solve every problem but it solves many.
I put this example together in 20 minutes to respond to a specific question, so I've only tested in a handful of browsers, let me know if you see anything weird. Thanks!
Variation of Balance Columns