css - 如何使背景适用于整个div

<分区>

Possible Duplicate:
why is my content showing outside the div?

我遇到一个问题，div 的背景样式没有涵盖嵌套在 div 中的所有内容。

这是一个jsfiddle向你展示我在说什么

如何在不设置绝对高度的情况下将 div ddg-corner-statements 中的灰色背景样式应用于 div 内的所有内容？

最佳答案

这是使用 float 时的常见问题。有几个常见的解决方案:

使用 clear: both 在 float 后添加一个 div。 Example .

<div style="float: left"></div>
<div style="float: left"></div>
<div style="clear: both"></div>

使用 CSS 属性 overflow: auto 将两个 float 添加到一个容器中。 Example .

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

将父元素设为 float 。 Example .

<div style="float: left">
    <div style="float: left"></div>
    <div style="float: left"></div>
</div>

使用 :after CSS 伪元素。 Example .

.parentelement:after {
    content: ".";
    display: block;
    height: 0; 
    clear: both; 
    visibility: hidden;
}

向父元素添加设置的高度。 Example .

<div style="height: 200px">
    <div style="float: left"></div>
    <div style="float: left"></div>
</div>

就个人而言，出于简单性和语义的考虑，我使用选项 2

查看代码的更新版本 here .

关于css - 如何使背景适用于整个div，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12859840/

相关文章：

javascript - 完成某项操作后，逐一显示 ajax 进程