One of the major difficulties in CSS-based web layouts is manipulating the height of elements. It was actually easier using the old tables method. There are two main difficulties: IE does not support min-height; and the container of floated elements is not supposed to vertically stretch to encompass those floated elements it contains.
A quick easy solution I find myself doing often is creating a little stretcher div after the floated elements. In the HTML you add this:
<div class="holder-stretcher"> </div>
While in the CSS you define the holder-stretcher class:
.holder-stretcher { clear: both; line-height: 0px; }
A bit ugly in your source code but saves a lot of hair.