清楚浮动的几种方法总结

为什么清楚浮动

因为对于没有设置高度的父元素，如果下面有子元素浮动，父元素无法被撑开，所以border和背景不能正常使用

解决的方法有很多种

• 最简单的是给父元素设置高度
• 在父元素的最后设置一个空元素，设置clear： both;
• 给父元素设置overflow : hidden; zoom : 1;
• 第三种作用于父元素 ，上代码
  

   
  .outer {zoom:1;}    /==for IE6/7 Maxthon2==/ 
  .outer :after {clear:both;content:'.';display:block;width: 0;height: 0;visibility:hidden;}   /==for FF/chrome/opera/IE8==/ 
  

  
  可以参考作者