html - 如何使边框区域环绕页面内容，其中页脚固定在页面底部，页眉固定在顶部

Question

考虑以下几点:

http://jsfiddle.net/PxabT/10/

有3个div hd, bd, ft。hd固定在最上面。 ft固定在底部。

我希望在不增加 ft 或 hd div 高度的情况下，石灰色边框完全围绕白色中心区域。

我该如何实现？

非常感谢!

编辑:参见http://jsfiddle.net/PxabT/15/这是通过将边框更改为填充而向前迈出的一步。

Answer 1

我实际上更喜欢这个解决方案。添加固定的左右栏。然后使用填充来防止内容区域流入它们。它也与您当前的代码非常相似。

http://jsfiddle.net/PxabT/46/

body{
   margin: 0;
   padding: 0;
}
#left { position: fixed; height: 100%; width: 10px; left: 0; background-color: lime; }
#right { position: fixed; height: 100%; width: 10px; right: 0; background-color: lime; }
#bd{
    padding-top: 40px;
    padding-left: 10px;
    padding-right: 10px;
}