php - "stretch"的 Wordpress 特定方法，(最小高度)等我的页面内容，以便我的页脚后没有空格？

Question

我有基本的编码经验。在我的 Wordpress 安装中，我的一些页面在页脚下有一个空白，因为没有足够的内容将它推到更高分辨率的显示器底部。这个问题在 chrome、Firefox、IE 等上一直存在。我想解决这个问题，以便:

1. 如果内容比浏览器分辨率短，“正文”将填满页面，直到页脚位于屏幕底部且前后没有空白。

2. 无论浏览器分辨率如何，页脚后都不会有空格，因此我尽量避免使用确定的“px”数字的代码。

3. 我希望页脚以传统的页面“底部”方式显示，而不是无论滚动多远都始终保留在屏幕底部的粘性页脚。

因为我在 Wordpress 中工作，所以我可以访问自定义 CSS 和源主题文件，但是，我更愿意使用自定义 CSS 和一个承认 Wordpress 特定修复的答案来解决这个问题。我尝试了几种解决方案但无济于事。有人建议我使用 Ryan Fiat 的“Sticky Footer”解决方案，但我不确定如何将其整合到我的 Wordpress 中，因为它使用 PHP，而且我主要使用自定义 CSS 进行编辑。

这是一个 Fiddle 我的页脚 PHP。

问。请为我提供一个清晰直接的 Wordpress 解决方案，确保当内容比浏览器短时，我网站的页脚下方没有空格。

您可以在我的 website here 上找到空白示例

我尝试过的解决方案:

1. #footer {overflow: hidden;} 在自定义 CSS 中不起作用。

2. 放置 html, body, parentDiv, childDiv, section, footer { height : 100%; 在我的自定义 css 中，但这没有用。

3. #copyright { padding-bottom: 20px;} “#copyright”在页脚下面，所以这确实将空白减少到似乎不存在的程度，但是在更高的浏览器窗口上，空白再次出现。

4. 像 Ryan Fiat 的“div-wrapper, body”解决方案似乎有积极的回应，但我还是找不到 Wordpress 特定的解决方案。

非常感谢那些有 Wordpress 使用经验的人的回答。

Answer 1

我不认为有一个很好的纯 CSS 修复，在不改变页面工作方式(粘性页脚或其他东西)的情况下在某种程度上不是 hacky。

这里有两个选项:

1. 使用 javascript 确定窗口的高度，减去页脚的高度，并强制内容部分具有该高度的最小值。调整窗口大小时，您还需要运行相同的函数。这不是一个很好的解决方案。

2. 我建议只添加 CSS 规则 body {background: #222} 使正文与页脚具有相同的背景。这样，如果它们的内容没有填满整个窗口，它看起来就像页脚填满了空白区域而不是白色。