带有 Compass 和 Sass 的固定区域的边框布局？答案

【问题标题】：border layout with fixed regions with Compass & Sass?带有 Compass 和 Sass 的固定区域的边框布局？
【发布时间】：2011-07-25 12:57:37
【问题描述】：

我正在寻找实现具有固定区域的传统边框布局的最佳方法（例如，具有固定页眉和页脚的页面），看起来 javascript 布局引擎并不是最好的方法。自从我完成基于 css 的布局以来已经有一段时间了，我希望 CSS3/Sass/Compass 能够更容易地实现过去有些困难的事情。

所以我正在尝试在 Compass 中创建一个固定的页眉和页脚边框布局，这很简单还是有更好的方法（框架、语言）来做到这一点？我只针对现代浏览器。

【问题讨论】：

【解决方案1】：

试试这个：http://jsfiddle.net/uwcEw/

我认为不完美但很接近。

【讨论】：

知道如何让“中间”div中的滚动条不重叠（内容和溢出-y设置为自动）-我尝试将其z-index更改为负值，但它是那时无法访问
很难得到你的问题。尝试修改/分叉该 jsfiddle 示例并显示您的意思。
jsfiddle.net/aCb7D/1 - 这有点微不足道，但我马上就注意到了。中间 div 中滚动条的顶部和底部像素覆盖相邻 div 的边框。相比：layout.jquery-dev.net/demos/complex.html，可以这么说。我在中间 div 上放了一个负 z-index，它解决了视觉问题，但是中间 div 不再活动。
您可以使用像素长度来代替百分比。这样，您可以在元素不会重叠的地方进行布局。我的例子只是一个想法。然而：负 z-index 是一个坏主意。您应该在边框元素上使用正 z-index 值。
后续问题认为也许您可以再次提供帮助：stackoverflow.com/questions/6159268/nested-border-layout-in-css