两个浮动列 \- 一个固定，一个松散宽度

Question

我环顾四周 SO ，但我找不到符合我出现的情况，我基本上有两列，一个固定宽度（185px），另一列没有固定宽度，但是我需要最后一列填充最后一个空格，例如

...........................................
.---------  ------------------------------.
.+       +  +                            +.
.+       +  +                            +.
.+       +  +                            +.
.+       +  +                            +.
.+       +  ------------------------------.
.+       +                                .
.+       +                                .
.+       +                                .
.---------                                .
...........................................

当第二列填充剩余宽度时，第一列应始终为底部的 100%，它们都是浮动的 left ，如果我调整浏览器窗口的大小，第二列显示在第一列下方。我需要第二列来填充剩余的宽度并在调整浏览器窗口大小时灵活。

原文由 MacMac 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

看看 这个。没有任何演示，但我以前使用过这个人的教程，所以我认为它工作正常。我从这篇文章中了解到，主要内容是流动的。侧面内容也可能是流动的，但我认为你可以给它一个固定的宽度并保持不变。这里的技巧是首先放置主要内容。

原文由 Zomxilla 发布，翻译遵循 CC BY-SA 2.5 许可协议

Answer 2

实际上有一种比使用浮点数更简单的方法：

 .container {
    position: relative;
}

.left {
    width: 185px;
    position: absolute;
    top: 0;
    left: 0;
}

.right {
    margin-left: 185px;
}

原文由 Jacob 发布，翻译遵循 CC BY-SA 3.0 许可协议