寬度100的浮動左和右的div

Question

之間空間％I對左側和右側一個div，無論固定的寬度。我有一箇中間div女巫也是固定的寬度。我希望中間div保持在左右div的中間，無論屏幕是否有reslolution，所以從左到中間div和空間從中間到右div div的距離是相同的。我怎樣才能做到這一點？

這是我走到這一步：

HTML：

<div id="container"> 
    <div id="left"> 
    </div> 
    <div id="content"> 
    </div> 
    <div id="right"> 
    </div> 
</div> 

CSS：

div{ 
    border: 1px solid black; 
    height: 200px; 
} 
#container{ 
    width: 100%; 
} 
#left{ 
    width: 50px; 
    float: left; 
} 
#content{ 
    width: 150px; 
    float: left; 
    margin: 0 auto; 
} 
#right{ 
    width: 100px; 
    float: right; 
} 

http://jsfiddle.net/Y5ZCT/

Answer 1

您可以絕對定位left和right的div並有center div在中間。

HTML

<div id="container"> 
    <div id="left"></div> 
    <div id="content"></div> 
    <div id="right"></div> 
</div> 

CSS

div { 
    border: 1px solid black; 
    height: 200px; 
} 
#container { 
    width: 100%; 
    position: relative; 
} 
#left { 
    width: 50px; 
    position: absolute; 
    left: 0; 
    top: 0; 
} 
#content { 
    width: 150px; 
    margin: 0 auto; 
    border:1px solid #f00; 
} 
#right { 
    width: 100px; 
    position: absolute; 
    right: 0; 
    top: 0; 
} 

JSFiddle