css - 主div两侧的div，填充剩余空间

Question

我在思考这个问题时遇到了麻烦。

我如何拥有一个固定宽度的 div，margin:auto，然后在该 div 的两侧都有自动调整宽度以填充其余空间的 div？

谢谢 感谢任何帮助

Answer 1

像这样没有任何容器的东西。

http://jsfiddle.net/JuG8W/

HTML

<div id="left">left</div>
<div id="middle">middle</div>
<div id="right">right</div>

CSS

#left{
   float:left;
   width: calc( 50% - 150px );
   background-color:blue;
}
#right{
    float:right;    
    width: calc( 50% - 150px );
    background-color:green;
}
#middle{
   float:left;
   width:300px; 
   margin:0 auto;
   background-color:red;
}