如何让内部div推动外部div向下

Question

假设我有一个div。在这个div里，我有两个div浮动在左边，靠在一起，我相信。左侧的div是用来放图片的。由于某种原因，当图片太高时，它不会推动外部div以适应图片。相反，图片只会自己继续并超出外部div的底部边界。我该如何使图片也扩展外部div呢？

<div>
    <div class="left">
    </div>

    <div class="right">
    </div>
</div>

- TIMEX

Answer 1

<div style="overflow: auto">
    <div class="left">
    </div>

    <div class="right">
    </div>
</div>

- Pekka

Answer 2

在包含 div 中添加 "overflow: auto;" 或 "overflow: hidden;" 都是不错的解决方案（每种方案都有自己的怪癖，具体情况取决于实际场景，但非常可靠）。您需要为此在 IE 中添加 hasLayout。最简单的方法是添加：

.container {
  overflow: hidden;
  display: inline-block; /* triggers hasLayout in IE */
}

.container {
  display: block; /* back to block */
}

更多选项在这里： http://www.sitepoint.com/blogs/2005/02/26/simple-clearing-of-floats/

这是一个关于清除浮动的简单方法的技术文章。请点击链接查看详情。

- Miriam Suzanne

Answer 3

如果您有一个带有两个元素的div，未浮动的最大元素将推动外层div。如果您有带有两个浮动元素的div，则需要使用clear:both的div来允许所有内容向下推动。

- Aea