divs垂直扩展以适合他们的子div吗？

我无法让我的div与他们的子div一起垂直扩展。divs垂直扩展以适合他们的子div吗？

我有这样的事情：

<div class='headerWrapper'> 
    <div class='header'> 
     <img..... height=100> 
    </div> 
</div>

在萤火，头div有100的高度，该headerWrapper div有0

的高度的图像是可见在div下方它....在headerWrapper div没有固定的高度。

那么困惑。

Thanks- 乔纳森

来源

2011-03-27 Jonathan

你可以发表你的风格吗？特别是'.header'或其内容是否浮动或绝对定位？ – marramgrass 2011-03-27 16:05:49

检查，看看是否有你的头格设置为浮动。

当一个子元素漂浮及其家长不，这将导致父元素“崩溃”，以0

高度此page似乎有问题的一个很好的说明大约一半下来页。

来源

2011-03-27 16:09:25

我发现[Clearing Floats]（http://www.quirksmode.org/css/clearing.html）非常有帮助。我不确定父容器是否漂浮真的很重要。即使父容器本身漂浮，它是否仍然包含其漂浮的孩子？ – DavidRR 2014-09-16 12:28:04

如果浮动它们，你可以用一个可爱的CSS技巧，使EM高:)

解决方案1：自动溢出父母

<style type="text/css"> 
    .headerWrapper {overflow: auto;} 
    .header {overflow: auto;} 
</stlye> 
<div class='headerWrapper'> 
    <div class='header'> 
     <img..... height=100> 
    </div> 
</div>

解决方案2：后EM使用clearfix

<style type="text/css"> 
    .clearfix:after {visibility: hidden;display: block;font-size: 0;content: " ";clear: both;height: 0;} 
</stlye> 
<div class='headerWrapper clearfix'> 
    <div class='header clearfix'> 
     <img..... height=100> 
    </div> 
</div>

来源

2011-03-27 16:09:56

divs垂直扩展以适合他们的子div吗？

回答

相关问题