html - 浮动 div - 填充可用宽度

Question

我必须让 div 浮动，一个在左边，另一个在右边。我想要做的（没有 js）是正确的 div 填充可用空间（宽度：100%）。问题是，左边的 div 有一个动态宽度，否则我可以简单地使用 margin-left。我也试过 display: 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>

编辑

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