左 div 填充剩余的水平空间？答案

【问题标题】：left div fill remaining horizontal space?左 div 填充剩余的水平空间？
【发布时间】：2010-08-25 08:19:13
【问题描述】：

我有两个 div

#left 和 #right。

右边的 div 有一个固定的宽度。

如何让左侧 div 占据所有剩余的水平空间？

【问题讨论】：

标签： css

【解决方案1】：

在#left 中浮动#right div，并留下不带浮动的#left。如果您希望浮动的#right 下方的空间为空，请将#left 添加到#right 宽度的右填充。

您可能还需要为#right 元素添加一个负的右边距，等于left 的右边距，以将其拉到#left 的右边缘。或者使用负边距，您可以将#left 设置为position: relative，并将position: absolute 添加到#right 到#left 的左上角（也使用#left 上的填充）。

【讨论】：

我做了一个非常相似的设置，右边在左边，右边浮动，右边有一个负边距，右边是它自己的宽度，左边有一个边距，右边是#rights，宽度。跨度>
我遇到了同样的问题，但这不是我的解决方案 - 我不能将 #right 嵌套在 #left 中，因为它们的背景会重叠并且我的背景是半透明的 - 我需要一个解决方案保持原来的嵌套。

【解决方案2】：

如何使用表格或 CSS display:table-cell;财产？

【讨论】：

使用 display:table-cell 实际上少了很多负边距、右填充等。请参见此处的示例：jsbin.com/oburey/4/edit 相当简单。