三栏布局（左侧和右侧宽度固定，中间自适应）

三栏布局（左侧和右侧宽度固定，中间自适应）的五种实现方式

参考：https://www.cnblogs.com/chengzp/p/layout.html

1.浮动布局 （ float ）

注：排列方式必须为 left  center  right。

思路：

设置左侧盒子左浮动，右侧盒子右浮动；

中间盒子的 Dom 写在最后。

<div class="container">
 <div class="left"> left </div>
 <div class="right"> right </div>
 <div class="center"> center </div>
</div>

.left{
    width:200px;
    background:green;
    float:left;
}
.center{
    background:yellow;
}
.right{
    width:200px;
    background:blue;
    float:right;
}

2. 绝对定位布局 （absolute）

思路：

设置父元素 po