css3实现左边固定,中间右边相等切自适应

.box{
background:green;
height:50px;
line-height:30px;
display:-webkit-box;
text-indent:10px;
}
.item{
-webkit-box-flex:1;
background:#fff;
margin:10px;
}
.item:first-child{
width:200px;
-webkit-box-flex:0;
}
.item:nth-child(2){
margin:10px 0;
}

 

 

 

<div class="box">
<div class="item">column1</div>
<div class="item">column2</div>
<div class="item">column3</div>
</div>

 

 

说明:重点是display:box的应用.如果是webkit内核记得加上标签.火狐浏览器对应!