固定宽度div之间拉伸中心div的问题

Question

我有3个div内联。其中2个设置了px宽度（外部div）。当窗口调整时，我希望中心div填充两个外部div之间的所有空间。

这是我尝试的例子： http://jsfiddle.net/3ZPHT

#div_1 { 
    float: left; 
    background: red; 
    display: inline-block; 
    width: 300px; 
    height: 50px; 
    text-align: left;} 
#div_2 { 
    overflow: hidden; 
    background: green; 
    display: inline-block; 
    height: 50px; 
    text-align: center; 
} 
#div_3 { 
    float: right; 
    display: inline-block; 
    background: blue; 
    width: 350px; 
    text-decoration: underline; 
    font-weight: bold; 
    color: white; 
    height: 50px; 
    text-align: right; 
} 

这里是什么，我希望它看起来像一个想法： http://jsfiddle.net/Q8eVz

任何帮助是非常赞赏，谢谢。

Answer 1

演示：http://jsfiddle.net/3ZPHT/1/

HTML：

<div> 
    <div id="div_1">LEFT COL STATIC WIDTH 300px</div> 
    <div id="div_3">RIGHT COL STATIC WIDTH 350px</div> 
    <div id="div_2">CENTER COL DYNAMIC WIDTH</div> 
</div> 

CSS：

#div_1 { 
    float: left; 
    background: red; 
    display: inline-block; 
    width: 300px; 
    height: 50px; 
    text-align: left;} 
#div_2 { 
    overflow: hidden; 
    background: green; 
    display: block; 
    height: 50px; 
    text-align: center; 
} 
#div_3 { 
    float: right; 
    display: inline-block; 
    background: blue; 
    width: 350px; 
    text-decoration: underline; 
    font-weight: bold; 
    color: white; 
    height: 50px; 
    text-align: right; 
}