使侧边栏 div 具有固定宽度，而主要内容是流动的答案

【问题标题】：Make a sidebar div a fixed width while the main content is fluid使侧边栏 div 具有固定宽度，而主要内容是流动的
【发布时间】：2012-07-19 18:14:03
【问题描述】：

我需要网站的主要内容在页面左边缘和侧边栏之间流动。但我希望侧边栏保持固定大小。

我见过一些解决方案要求侧边栏位于 DOM 中的主要内容之前，但在这种情况下，侧边栏必须位于 HTML 中的主要内容之后。

现在侧边栏向左浮动，但它位于主要内容的下方。我需要它位于主要内容旁边，同时保持主要内容的流动宽度。

【问题讨论】：

【解决方案1】：

这里我用position: absolute做了一个小技巧，也许这就是你想要的？

【讨论】：

感谢Haynar，但这种技术对我来说存在问题。有时侧边栏可能比容器长，这使得它位于页脚的顶部。我试图通过 JS 来解决这个问题，但有时也会有 div 在主要内容中展开。所以它变得非常棘手。
@Owen 在我的站点中我已经修复了通过 JS 将主要内容和 div 的高度设置为两者的最大值
我指的是主要内容和侧边栏的高度
再次感谢，但我实际上找到了一个非常适合我的网站的解决方案，并且不需要 JS。请看我的回答

【解决方案2】：

我同意@haynar。测试时，我试图将侧边栏放在左侧，将主要内容放在右侧。确保在使用该代码时，不仅将 position:absolute; 添加到侧边栏 div，而且还为主要内容 div 设置 margin-right:250px;。

【讨论】：

【解决方案3】：

对这两个容器尝试display: table-cell - 请参阅http://jsfiddle.net/kK5Ly/9/

【讨论】：

【解决方案4】：

我在这个堆栈溢出问题中找到了答案：

这就是答案：

显示 CSS 代码以了解它是如何完成的。

【讨论】：