2-Col Tableless Layout Tutorial at Wellstyled.com

Sometimes you may need two columns of the same height in your layout. If the height of their content differs, their backgrounds should flow and end at the same position. This is exactly how columns were made by tables.

There are several ways to make two columns in CSS. You can use one floating block, both blocks floating, one block positioned into other’s margin etc. Anyway, every time the block ends where its content ends. That’s OK — in fact, the “same-height columns” is just a design illusion: not the columns, but the background under them makes the effect. Thus, let’s make the columns of their own height and then just play with the background. That’s the matter.

View the Tutorial