左边固定宽度右边自适应的三种方法

<div class="both">    <div class="left"></div>    <div class="right"></div></div>

一、用flex

.both{    height:500px;    display:flex;    flex-direction: row;}.left{    background:red;    width:200px;}.right{    flex:1;    background:blue;}

二、float

.both{    height:500px;    overflow:auto;    *zoom:1;}.left{    background:red;    width:200px;    float:left;    height:100%;}.right{    margin-left:200px;    background:blue;    height:100%;}

三、定位

.both{    height:500px;    position:relative;}.left{    background:red;    position:absolute;    width:200px;    left:0;    height:100%;}.right{    background:blue;    margin-left:200px;    height:100%;}