简体   繁体   中英

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

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

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>

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.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM