Html 如何使DIV匹配浮动子对象'；s高度（浮动柱），但允许子元素在侧面突出

我正在设计一个有3列的布局，基于一个包含3个浮动div的div

问题是container div与我想要的列高度不匹配。它的行为就好像它根本没有内容一样，因此这3列垂直突出

为了解决这个问题，我尝试了overflow:hidden，它成功了，但是我的设计在左侧有一个突出的div，它被弄乱了，因为这个属性不会让任何东西突出

---

有没有更好的方法来解决身高问题？谢谢。

使用clearfix类-该类可以完成以下工作：

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}
.clearfix:after {
    clear: both;
}
.clearfix {
    *zoom: 1;
}

---

勾选

通常，您可以在所有孩子的身后插入一个

，使容器的高度延伸到孩子的末端。。像这样

<div id="container">
    <div class="child0"></div>
    <div class="child1"></div>
    <div class="child2"></div>

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

---

我不确定社区是否认为这是黑客行为。但我有时用它。此外，我还看到人们不使用div，而是使用

并应用该样式。

假设我正确理解了这个问题，您可以使用清除div：

   <div id="dre">
        <div class="float" style="height:100px"></div>
        <div class="float" style="height:200px"></div>
        <div class="float" style="height:30px"></div>
        <div id="clear"></div>
    </div>

---

在这里查看-

向我们展示您的HTML，向我们展示您当前的CSS，向我们展示您希望它看起来像什么的图片。理想情况下，发布一篇文章，这样我们就可以看到正在发生的事情，并且更容易地建议和演示更改。基本上：帮助我们帮助你。（若要在问题中包含更多信息，请使用标签下方的“编辑”链接；请不要尝试在评论中发布代码。）