清除浮动

1、父级添加overflow: hidden；

给浮动元素的容器添加overflow:hidden;或overflow:auto;可以清除浮动。
在添加overflow后，浮动元素回到了容器层，把容器高度撑起，达到了清理浮动的效果。

<div class="news">
  <img src="news-pic.jpg" />
  <p>some text</p>
</div>

.news {
  overflow: hidden;
  *zoom: 1;
}
.news img {
  float: left;
}
.news p {
  float: right;
}

2、clear:both;

.clear {
  clear: both;
}

3、CSS的:after伪元素

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

.clearfix {
  zoom: 1; 
}