设置背景以运行到与页面高度无关的页面底部答案

【问题标题】：Set a background to run to the bottom of a page independent of page height设置背景以运行到与页面高度无关的页面底部
【发布时间】：2013-10-27 22:56:08
【问题描述】：

我希望灰色背景一直持续到当前窗口的高度。我尝试将高度设置为#default-wrapper-body 的 100%，但这似乎没有任何作用。

我还添加了一张图片，右侧框中的区域应该在所有页面上延伸到页面底部，而不仅仅是主页。

【问题讨论】：

标签： css

【解决方案1】：

发生这种情况是因为浏览器由于某种原因无法检测到页脚的高度，而且您没有对所有元素使用包装器，快速解决方法是将以下 CSS 添加到您的样式表中：

#footer_footnote_wrapper {
    height: 80px;
    border-bottom: 1px solid #DCDCDC;
}
html, body {background:#f3f3f3;}

【讨论】：

我添加了您的建议，但在此页面上背景仍然被切断：zorgbeurs.nl/aanmelden
嗨，我已经通过添加边框更新了我的答案，并确保您也使用 html 正文部分。
您好，谢谢。当我这样做时，页脚下方会添加一个灰色区域。但是，我希望整个中心为白色，并将页脚部分与页面底部对齐。就像它目前在主页上一样。该怎么做？
那你需要添加一个高度为100%的包装器。
我在#default-wrapper-body 中添加了 100% 的高度，但这并不能解决问题。我应该在哪里嵌套这个新的 100% 高度包装器，我是否需要从我的 CSS 中删除您现有的建议？再次感谢！ :)

【解决方案2】：

html, body, form, #default-wrapper-body { height: 100%; }

最好将表单移动到 #default-wrapper-body 内，以防止所有表单被拉伸到 100% 高度。

【讨论】：

【解决方案3】：

我认为 cookiebar div 导致底部出现白色条纹，它有 background:none;当它可见时，背景看起来很好，一直到底部。

【讨论】：