父div中的子div,float:left

Question

请看一下我的代码:http://jsfiddle.net/XptrZ/ 为什么不是红色内的蓝色div,以及为什么红色的高度= 0.我怎么解决这个问题？谢谢

Answer 1

添加overflow: hidden到父级

.parent {
  background-color: gold;
  border: 1px solid gold;
  position: relative;
  overflow: hidden
}

.child {
  float: left;
  width: 100px;
  height: 100px;
  display: block;
  margin: 10px;
  background-color: pink;
  border: 1px solid #999;
}

<div class="parent">
  <div class="child">div1</div>
  <div class="child">div2</div>
  <div class="child">div3</div>    
</div>