高度塌陷

• 本来父元素是由子元素抻开的，子元素设置了浮动之后，子元素就脱离文档流了，父元素无法抻开，就会形成高度塌陷

---

解决高度塌陷

• BFC
• 父元素的垂直外边距不会和子元素重叠
• 开启BFC的元素不会被浮动元素所覆盖
• 开启BFC的元素可以包含浮动的子元素

---

如何开启BFC

• 设置元素浮动

• 设置元素的绝对定位

• 设置元素为inline-block

• 将元素的overflow设置为一个非visible的值（副作用最小的）

    .box{
              border:10px red solid;
              overflow:hidden;
          }
  

兼容IE6浏览器

    hasLayout  zom:1;