What ive done here is to use a source order method. Notice that with this method all cloumns actually float left and are appear in the order in which they are coded in the xhtml.
Instead of clearing the floats by inserting a clearing element below the floats ive added overflow: auto to the column containers and not set an explicit height. this allows the container box to expand with the height of the float resulting any divs below the container to be pushed down.
Lastly, notice the browsers hacks (css selectors containing * html) with the -3px margins. These hacks direct the styles to override for IE to account for its float bug. Hacks ofcourse should be avoided if not used at all, but in this case it was easier than makin a detection method with ie conditions/dynamic css/js