css - 新的 "hidden footer"有效，但仍然与屏幕底部的内容重叠

Question

我正在设计 http://www.vanessacaroline.com并且需要一些 CSS 帮助。如果您当前的屏幕分辨率没有使问题变得明显，请尝试重新调整窗口大小，以便样本 2 列布局会插入页脚——最简单的演示方法是捕获浏览器窗口的底部边缘, 并向上拖动。

恶心吧？不仅内容没有按应有的方式将页脚向下推，而且页面甚至没有创建滚动条。

如果水平缩放窗口，第二个 float 列 div 会下降并淹没页脚。

但是，如果水平缩小窗口，最终列内容会开始将页脚向下推...这是正确的功能，但我似乎无法摆脱最初的洪水。

我一直在尝试做一个相对fluid layout ;我使用了这个引用:http://ryanfait.com/sticky-footer/对于页脚代码。我在网上看到了其他几种方法，但我选择了这种方法——我想要正常的内容/滚动条行为，页脚始终贴在页面底部；谁能帮忙？

谢谢!

编辑:我用第一个建议更新了网站——clear:both in the #push, position:relative for #wrapper, #push and #footer。现在，页脚出现在加载屏幕位置的阈值下方...这会产生一种不错的“隐藏页脚效果”。

我喜欢这个——但是在极薄的屏幕分辨率下演示，页脚与底部的内容重叠。 我该如何避免这种情况？？？

Answer 1

您应该从#wrapper 中删除负边距并设置clear:both;position:relative； 用于#push。希望这会有所帮助 :D