CSS 3 column using float

Posted under » CSS on 03 April 2009

Simply

<div class="col1">First column</div>
<div class="col2">Second column</div>
<div class="col3">Third column</div>

<br class="clearfloat" />

The trick is to use "float" either left or right like so. Then don't forget to clear it. Heres how the css would look like.

.col1, .col2, .col3 {
float:left; 
}

.clearfloat { 
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}