浮动div - 填充可用宽度

Question

我必须漂浮div，一个在左边，另一个在右边。我想做的（没有js）是正确的div填充可用空间（宽度：100％）。问题是，左边的div有动态宽度，否则我可以简单地使用margin-left。 我也尝试过显示：table-cell;但这不允许我使用边距，只允许使用边距。

有什么建议吗？

Answer 1

你可以这样做，在IE8和更好的，在FF，在Safari中工作。您可以使用填充而不是边距，如下例所示：

<style>
    .c_0 {
        display:        table;
        width:          100%;
        border:         4px solid orange;
    }

    .c_1 {
        display:        table-cell;
        width:          20%;
        border:         1px solid red;
        padding-right:  20px;
    }

    .c_2 {
        display:        table-cell;
        border:         1px solid blue;
    }
</style>

<div class="c_0">
    <div class="c_1">
        has a width and padding instead of margin
    </div>
    <div class="c_2">
        has the rest
    </div>
</div>

修改

这仅适用于第一行的“％”。我看到它太晚了，你想要像素。