粘性页脚表现得很奇怪答案

【问题标题】：Sticky footer acting weird粘性页脚表现得很奇怪
【发布时间】：2012-08-04 13:30:20
【问题描述】：

我为我的网站制作了一个粘性页脚，但它不像我想要的那样。我希望它完全位于底部，始终取决于内容的长度。相反，它总是按原样出现在屏幕上。谁能帮帮我？

页脚css：

#footer{
position: fixed;
bottom: 0;
z-index: 1;
width: 100%;
height: 50px;
clear: both;
background-image: url("../images/footer_pattern.png");

}

【问题讨论】：

如果它不总是出现在屏幕上，它还会粘吗？
试试这个教程：ryanfait.com/sticky-footer
我希望它被页面的内容下推。在较小的屏幕上，这种方式会更好，这样他们就可以在不滚动的情况下看到更多内容。我当然会对我的内容有一个最小高度，所以我可以最低限度地处于底部。没错，就像我的内容通过页脚一样。无意。
听起来你根本不想要一个粘性页脚，你想要一个普通的页脚
此网站在 iOS 上无法正确渲染，页脚距右侧约 25 像素，页眉垂直方向过大 1 像素并且在滚动时跳转。但是为了帮助您解决问题，页脚是在内容之外还是包含 div 的内容？

标签： html css position sticky-footer

【解决方案1】：

#footer{
width: 100%;
height: 50px;
clear: both;
background-image: url("../images/footer_pattern.png");
display: block;
margin-top: 0px;
//if contains children add overflow:hidden;
}

【讨论】：

我不能说我 100% 确定您实际想要实现的目标，但我猜您正在尝试将 div 修复到主要内容 div 的底部固定的位置让你有点失望。如果您修复它不会随内容增长的位置，它将停留在页面底部。
是的，我现在确实看到了。它不能像这样正常工作。我认为问题是我的内容是绝对位置？有解决方法吗？我只是要发布我的整个 css 文件。
还值得注意的是，要使页脚和内容对齐，您需要确保没有将它们分开的边距。
您不需要绝对定位您的内容，这可能是它在 iPad 上被丢弃的原因。只需将整个页面包装在具有所需宽度尺寸的 div 中，然后添加边距：0 auto;它会为你居中。
是的。抱歉，回复之间的时间。我在做这个的时候正在做晚饭。

【解决方案2】：

您的问题有点含糊，但如果我理解正确，我认为您正在寻找的是位置：相对。

position: relative;
bottom: 10px;

它的作用是在元素和下一个相对父元素之间添加指定数量的空间（10px）。祝你好运！

【讨论】：

应该放在什么组件上？顺便说一句，谢谢你的回答:)
在你的#footer div 上，但我认为这对你想要的没有帮助。