我正在创建一个网页，我需要在页面中央有一个内容栏(包括固定宽度)，在该内容栏的左侧和右侧有两个不可滚动(固定)的栏(包括也固定宽度)。左侧列需要与中间内容列的左侧对齐。右列需要与中间内容列的右侧对齐。 如果内容栏有很多内容，中间的内容栏应该可以滚动，并在浏览器的右侧有一个滚动条。但是左右两列不能滚动，而是固定在浏览器的顶部。 调整浏览器宽度时，左+中+右列将保持其宽度并在网页中间居中。在左列的左侧和右列的右侧，空白将在两侧以相同的宽度增加/减少。
在我的屏幕示例中，您可以找到我要解决的问题的概念。
我试图在 stackoverflow 和 google 上搜索这个问题，但我只找到了一些不同的例子。
谁知道如何解决这个问题？
最佳答案
example in JSBin -(请参阅下面的更新版本，这是错误的，固定列是粘性的)
- 绿色不是必需的，它在那里 显示包装实际上是 集中整个地段
- 绝对
定位左右环绕
首先是
position:fixed列不要转到视口(viewport)的一侧
更新
现在 中没有错误的版本 JSBin
嗯，这比我想象的要难；这个适用于 IE7、8、Safari、FF3.6、Opera、Chrome
查看注释的源代码，特别有趣的是指针事件，没有它们，较新的浏览器将无法点击(选择文本或点击链接)“覆盖”div，这就是这个布局所做的事情它是覆盖绝对定位 div 并使用绝对定位和相对位置来绕过滚动、垂直和水平、内容消失和固定固定 div 的问题
根据评论更新为使用 jQuery
示例:here
关于css - 如何创建包含的 css 列。可滚动的中间列和 float 的左右列，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5436897/