div

<div id="container">
    <div id="left">左边</div>
    <div id="mid"><input type="text" style="width:100%" value="我是自动扩展的，但不会破坏父容器的宽度。" /></div>
    <div id="right">右边</div>
</div>

#container {
    width: 400px;
    height: 200px;
    display: table
}
#left, #mid, #right {
    display: table-cell;
    background: #ccc;
    outline: 2px dashed blue
}
#mid {
    width: 100%;
    background: #f0f;

}

#left,#right {
    padding-left:15px;
    padding-right:15px;
    white-space:nowrap;
}

http://jsfiddle.net/xhCXq/350/

--------------------ul居中-------------------------

取消li下的float;即不让li浮动,

li{display:inline-block; zoom:1; *display:inline;}

然给外面的容器元素 text-align:center