css_26_BFC

定义：

块格式化上下文（Block Formatting Context,BFC）是Web页面的可视CSS渲染的一部分，是块盒子的布局过程发生的区域，也是浮动元素与其他元素交互的区域。

开启了BFC能解决什么问题

1．元素开启BFC后，其子元素不会再产生margin 塌陷问题。
2．元素开启BFC后，自己不会被其他浮动元素所覆盖。
3．元素开启BFC后，就算其子元素浮动，元素自身高度也不会塌陷。

如何开启BFC

1.根元素
2.浮动元素
3.绝对定位、固定定位的元素
4.行内块元素
5.表格单元格：table、 thead、 tbody、tfoot、th、td、tr、caption ·
6.overflow 的值不为 visible 的块元素
7.伸缩项目
8.多列容器
9.column-span 为 all 的元素（即使该元素没有包裹在多列容器中）
10.display 的值，设置为 flow-root

        .outer {
            width: 400px;
            background-color: #888;
            float: left;
            position: absolute;
            display: inline-block;
            display: table;
            overflow: auto;
            column-count: 1;
            display: flow-root;
        }