Expanding Divs Containing Floated Elements

Today I was working on a site with one center column that contained two columns within and I ran into a rather distressing problem (in the most extreme of ways of course). When I floated my left column to the left as well as my right column, I noticed that the container div shrunk itself to the size of it’s padding, leaving the internal divs just hanging outside (in the cold). I toyed with all the css properties I could think of to no avail. I even consulted the plastic green ninja on my desk. After all else failed, I decided to consult the almighty Google. Behold, my findings…

The website I found was a bit outdated since it referenced Firefox 1.5 as well as IE 5.0 (and IE 5 for Mac…I didn’t know they ever had one of those). Despite its apparentĀ obsolescence, the information it gave was still valid for this particular article.

I’ll spare you the talk and give you the link.

The method I ended up using was applying overflow:auto; to my div.