3个div，一个固定宽度

Question

我不确定这是否可以在html css中明白。

我在一行中有3个div 第二个div必须占用200px的宽度和第一个＆amp;最后一个div必须占用剩余的宽度。

http://jsfiddle.net/Garav/gk9t3/

其余两个div在小提琴中固定为100px。有没有办法让它们在两侧平均填充剩余的屏幕，这样第二个div总是保持在中心？

注意：父div的宽度不固定。

Answer 1

证明：http://jsfiddle.net/5Br5A/

CSS

.image-placeholder{
    background: #0f0;
    width: 200px;
    height : 200px;
    clear:none;
    float: left;
}
.fill-remaining {
    height:200px;
    width:50%;
    clear:none;
}
.fill-remaining.left {
    background:#f00;
    float: left;
    margin-right:-100px;
}
.fill-remaining.left>div {
    padding-right: 100px;
}
.fill-remaining.right {
    background:#00f;
    float: right;
    margin-left:-100px;
}
.fill-remaining.right>div {
    padding-left: 100px;
}​

HTML

<div class="fill-remaining left">
</div>
<div class="fill-remaining right">
</div>
<div class="image-placeholder">
</div>

Answer 2

只需使用保证金：0自动;不需要保证金div：http://jsfiddle.net/gk9t3/3/

Answer 3

我在另一个div中添加了中间div，并将其居中。看看这是否符合您的要求：http://jsfiddle.net/gk9t3/1/