html - 3个div，1个固定宽度

Question

我不确定这在 html css 中是否可行。

我在一行中有 3 个 div，第二个 div 必须占据 200px 宽度，第一个和最后一个 div 必须占据剩余宽度。

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

其余两个 div 在 fiddle 中固定为 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

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

Answer 3

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