Question

我想在主DIV中放置2个垂直DIV时遇到问题。 background-color值不适用于主DIV。我想我必须看到一些红色背景的部分请看一下jsFiddle并帮我解决。

Answer 1

尝试添加带有clear:both CSS属性的空div或将高度设置为主div。

<div id="content">
    <div id="float-left">Some Text floating left</div>
    <div id="float-right">Some Text floating right</div>
    <div id="clear"></div>
</div>

CSS代码

#content {
    background-color:red; /* The background you want */
    width:500px; /* Demo: not important */
}

#float-right {
    float:right;
    width:300px;
    padding-right:20px;
    line-height:200%;
    background-color:#f2f2f2
}

#float-left {
    float:left;
    width:50px;
    background-color:#e1e1e1
}

#clear{
   clear:both
}

See Demo

Answer 2

这是因为你的父DIV没有身高。您将子DIV设置为float，因此它不会影响父DIV的大小。您需要手动设置父DIV的高度或使用clear：both;属性

背景颜色与浮动元素

2 个答案: