css：内容框穿越固定页脚框

Question

我有固定的页脚DIV和内容DIV。页脚DIV是固定的，因此它始终可见。内容DIV高度为100％，但它触及页脚DIV并将其交叉到最后。我希望它只是在页脚开始时结束。

<div id="footer">
</div>

<div id="content">
</div>

以下是 jsFiddle 链接：http://jsfiddle.net/MXMWe/3/

问题：内容DIV（及其文字）翻页。

注1：无论您在哪里滚动（可能已修复），页脚都必须始终可见。

注2：首次加载浏览器时，滚动条必须正常。那里没有变化。

这是一个图像，告诉我想要实现的目标：

如果被问到，我会提供更多信息。

非常感谢。

Answer 1

我更新了jsfiddle：

http://jsfiddle.net/MXMWe/4/

一些事情：

1. 我在<div id="footer-padding></div>的结束div之前添加了#content。然后在css中添加height:120px;（与#footer相同的高度） - 这允许内容文本不会卡在网站的底部，而是位于页脚的顶部。
2. 我删除了页脚上的不透明度，因为如果你有不透明度，它会影响整个div - 来自内容div的文本会在后面显示，因为它是透明的。
3. 我在z-index: 2添加了#footer，以确保它始终高于#content。

如果您要将不透明度/透明度作为页脚的背景，您将在其后面看到任何内容。

Answer 2

您是否尝试过使用CSS Sticky Footer？