Question

我无法让我的div与他们的孩子div垂直扩展。

我有这样的事情：

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

在firebug中，标题div的高度为100，headerWrapper div的高度为0。

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

太困惑了。

Thanks- 乔纳森

Answer 1

检查并查看是否将标题div设置为float。

当子元素浮动且其父元素不浮动时，这会导致父元素“折叠”到高度0。

这个page似乎对页面中间的问题描述得非常好。

Answer 2

如果你浮动它们，你可以使用lil 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>

div是否垂直扩展以适合他们的孩子div？

2 个答案: