我设置了外部div的背景色为蓝色,但是没有显示出来,为什么?
它的一个演示:
.question-template {
width: auto;
height: auto;
background-color: blue;
}
.question {
float: left;
margin: 10px;
}
.participants {
background-color: green;
float: left;
margin: 10px;
}
<body>
<div class="question-template">
<div class="participants">234</div>
<div class="question">Some lorem ipsum text</div>
</div>
</body>
7条答案
按热度按时间8i9zcol21#
像这样试试...
muk1a3rh2#
这是因为你的两个子元素都是向左浮动的,这意味着容器不会伸展到包含子元素所需的最大高度。
要解决这个问题,你需要在你的css中添加一个clearfix类:
然后将类添加到HTML中,如下所示:
更多信息,请访问:http://css-tricks.com/snippets/css/clear-fix/
7xzttuei3#
*Live demo*........您好,现在请定义您的父div
.question-template overflow:hidden;
帮你父母洗脱罪名
Live demo
piztneat4#
将
overflow:auto
加到.question-template
http://jsfiddle.net/4zjtp/2/
q7solyqu5#
你需要在父div上应用一个clear the float来确保它占据了内部元素,你可以在父div关闭之前插入一个
<div style="clear:left;"></div>
或者在父div上应用一个clearfix类。然后只需将clearfix类添加到父div
Working Example
q3aa05256#
检查你的
display
属性,也许是它的inline
?将它更改为block
或其他。kuarbcqp7#
<div>
元素使用固定高度,将如下所示