布局固定宽度，具有固定页脚的全高，全宽
问题描述：
我可以在布局上使用一些帮助。这就是我想要实现：布局固定宽度，具有固定页脚的全高，全宽
，规格如下：
- 头已经固定高度
- 页脚始终处于底部，具有全宽（100％ ）
- 内容有固定宽度
- 内容基本上有全高减去页脚，但重叠页脚正好20px
这当然必须在内容比视口短且长的情况下工作。 我一直在玩这个几个小时，我只是无法完成所有的功能。
我创建了一个捣鼓在这里：http://jsfiddle.net/Sq4Pk/6/
这种解决方案的问题是目前：
- 视得到越短，内容重叠页脚（必须以20像素）
- 内容部分不填充视口
这甚至可能吗？有人能帮我解决这个问题吗？
我已经试过这些解决方案及其变化，但两者都是从我的用例稍有不同：
非常感谢您的帮助！
克里斯
答
我创建了一个拨弄着一个可能的解决方法，在页脚插入两个额外的div来假的覆盖。
一个令人讨厌的缺点：在Chrome中，最高的div（用于屏蔽阴影）在调整大小后似乎改变了1px。 FF + IE很好。
编辑：发现在Chrome像素移位修复：http://jsfiddle.net/Sq4Pk/4/
EDIT2：或者如果它是使用jQuery的选项，结果甚至略胜一筹：http://jsfiddle.net/Sq4Pk/5/
感谢你的回应！问题是#content不应该滚动，它应该随内容一起增长并在每种情况下填充视口。对此有何想法？ – Chris 2011-12-19 10:59:05
在这种情况下，只需将#content设置为溢出：隐藏 - http://jsfiddle.net/Sq4Pk/7/ – ptriek 2011-12-19 11:01:49
这只会隐藏内容，而不是扩展#content以适应一切。 – Chris 2011-12-19 11:08:59