两栏布局

左侧定宽，右侧自适应

.left {

    width: 200px;

    height: 600px;

    background: red;

    float: left;

    text-align: center;

    line-height: 600px;

    color: #fff;

}

.right {

    margin-left: 210px;

    height: 600px;

    background: yellow;

    text-align: center;

    line-height: 600px;

}

三栏布局

---

第一种 浮动

当宽度小于左右宽度之和时右侧栏会掉下去 效果

第二种 flex

不限定middle高度会随着right的高度走