How do I fix this div overflow?

Question

I have a minor CSS issue. This is the website. As you can see, the div at the bottom overflows. How do I fix it? I suppose it's just a CSS rule I have to add/change. Thanks

Answer 1

Apply:

overflow:hidden;

to site_content_large_div

...or, if you want the div to grow with its contents, and for its container to work properly, then remove the height value applied to site_content_container_div, and apply a clearfix to the same, so that it's enclosed, floated elements will contribute to its calculated height.

Clearfix solves a common problem with float-based layouts, so it's best to create a separate, reusable class for this fix that you can apply to any element containing floats that need to be entirely visually contained.

This article provides all the necessary code: http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified/