<div id="container"> <div id="left">左边</div> <div id="mid"><input type="text" style="100%" value="我是自动扩展的,但不会破坏父容器的宽度。除了左边和右边占用的宽度后,剩下的宽度就是我的了。" /></div> <div id="right">右边</div> </div>
#container {
400px;
height: 200px;
display: table
}
#left, #mid, #right {
display: table-cell;
background: #ccc;
outline: 2px dashed blue
}
#mid {
100%;
background: #f0f;
}
#left,#right {
padding-left:15px;
padding-right:15px;
white-space:nowrap;
}
http://jsfiddle.net/xhCXq/350/
http://stackoverflow.com/questions/5505554/set-edge-divs-to-fill-remaining-width