当div中的div浮动时，Div不会延伸到其内容的底部

Question

我有2个div作为列，两个都向左浮动并设置为清除无。它们的容器div在顶部有一个背景图像，因此背景位于两列的顶部。

我希望能够在列的底部有一个背景图像。我创建了另一个div，它位于容器div内（但在列之外）并在底部设置了背景图像。

问题是这个div没有扩展到它包含的列的底部。我该怎么做呢？我试过玩漂浮物和清理但没有任何运气。

Answer 1

将外部<div>“溢出：隐藏;”。

Here is a jsfiddle.

Answer 2

尝试将外部div设置为float：left以及

Answer 3

您可以在主容器内的最后一个元素中设置以下内容：

#lastElement:after {
    content:'.';
    display:block;
    visibility:hidden;
    overflow:hidden;
    height:0;
    clear:both;
}

这将创建一个带有清除的新块元素，并将解决您的问题。 Pointy给出的答案也有效，但如果容器的宽度/高度固定并且内部内容可以更改（更多文本或添加其他图像），则会失败，然后容器的内部内容将自行隐藏。 / p>

Answer 4

尝试将div放在列容器div的底部，如下所示：

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

在黑暗中有点刺痛但是我能想到的最好却没有亲眼看到代码，希望它有所帮助。