CSS height:auto doesn't work with my wrapper div

Question

I was hoping someone can take a look at my site and tell me what may be going on here. The problem I'm having is that the #bodyWrap div is not automatically stretching to the height of one of it's children, #contentWrap. #contentWrap stretches fine to fill all the content on that page, but this does not bubble up to the parent, #bodyWrap. Thanks in advance for any insight.

http://www.jacobsmits.com/placeholderRX/index.html

Answer 1

You must add a clearer div before your closing containers:

<div style="clear:both;"></div>

Floating items won't affect the height of the container...coz it is floating ;).

Working Live Example : http://jsfiddle.net/LBH5h/

Example :

<div id="content">
  <!-- floating child --> <div style="float:left;"><!-- floating child content --></div>

  <div style="clear:both;"></div>
</div>

Answer 2

If something usually won't auto adjust the height for me then I will troubleshoot with these steps.

1. Set the height to something ridiculous (1000px)
2. If that make a difference then check all floats
3. Add a clear:both; statement.
4. If it's still not working, add separate border colors to all of your divs. It should help you out to see whats setting the height properly and whats messing up the website.