【发布时间】：2013-04-13 07:58:32
【问题描述】：
我有一个简单的 2 块列：
<div id="wrap">
<div class="column_1"></div>
<div class="column_2"></div>
</div>
我希望column_2 的宽度是固定的，比如 60 像素。两列都向左浮动。并且列的组合总（可变）宽度等于换行总宽度：
#wrap { width: 100%; }
.column_1, .column_2 { float: left; }
.column_2 { width: 60px; }
注意：换行会改变宽度，因为它嵌套在不同大小的块内。
一个很好的使用示例是 column_1 中的文本输入，column_2 中有一个按钮。自然地，按钮保持相同的大小，而 column_1 内的输入将相应地拉伸。
如何处理这个问题？
注意：我更喜欢 CSS 解决方案，但如果这真的不可能，我愿意使用 jquery 解决方案。
【问题讨论】：
-
这个怎么样？ jsfiddle.net/XzH43
-
您是否打开了使用 javascript 的选项？或者你想做纯CSS？如果你想做纯 CSS，请查看
flexbox。 -
@adaam 不起作用。如果您将 #container 宽度更改为更大，.column_1 保持不变。
-
@Zendy 如果 js 或 jquery 是唯一的方法。 flexbox 看起来很像，但似乎仍然不受支持。所以我猜js是唯一的选择？
-
我认为小提琴很完美，我尝试将#包含宽度设置为 700，但仍在向 .colum1 添加内容，它的宽度增加了。