CSS粘性页脚-当content div包含大量文本时没有滚动条

我试图建立一个粘性页脚。我看了ryanfaits的版本和这个版本

最后一个很好，但问题是，当我在content-div中放入大量内容时，页脚会向下移动，content-div处没有滚动条。我尝试在content-div中设置最小高度、最大高度、高度，当然还有overflow=auto和overflow-y。最后一个显示至少一个已禁用的滚动条，但仍不工作

有什么想法吗？我很沮丧：(

非常感谢！ 罗恩

看看

如果我使用并扩展内容，它不会显示div的滚动条。也许你应该将你的html/css发布到网上，这样人们可以在这对你没有帮助的情况下查看。

看看

---

如果我使用并扩展了内容，它不会显示div的滚动条。也许你应该将你的html/css发布到网上，这样人们就可以在没有帮助的情况下查看了。

首先，将其添加到你的css中

html {
    height: auto;
    min-height: 100%;
    overflow-y: scroll;
}

第二，我没有尝试你的粘脚，但我经常用这个

---

这非常有效。

首先，将其添加到CSS中

html {
    height: auto;
    min-height: 100%;
    overflow-y: scroll;
}

第二，我没有尝试你的粘脚，但我经常用这个

这很有效。

罗恩 我也有同样的问题，所以是的，您的问题对于粘性页脚是有效的。您可以尝试将以下内容放在内容容器中，您的内容从顶部开始130像素

#content-container {
margin-top:130px;
position: absolute;
top: 0; 
bottom: 0; 
left: 0; 
right: 0;
overflow: auto;
}

实际上，我通过这样做完成了整个包装器div滚动：

#wrapper {
min-height:100%;
height: auto !important;
height: 100;
margin: 0 auto;
position: absolute;
top: 0; 
bottom: 0; 
left: 0; 
right: 0;
overflow: auto;

}

}罗恩 我也有同样的问题，所以是的，您的问题对于粘性页脚是有效的。您可以尝试将以下内容放在内容容器中，您的内容从顶部开始130像素

#content-container {
margin-top:130px;
position: absolute;
top: 0; 
bottom: 0; 
left: 0; 
right: 0;
overflow: auto;
}

实际上，我通过这样做完成了整个包装器div滚动：

#wrapper {
min-height:100%;
height: auto !important;
height: 100;
margin: 0 auto;
position: absolute;
top: 0; 
bottom: 0; 
left: 0; 
right: 0;
overflow: auto;

}

---

}

请给我们看一下您的代码好吗？我刚刚使用了这两个网站的代码。看到他们的代码正常工作，但当您尝试实现它时，我不禁感到您的实现与您引用的源代码之间一定存在不一致，这就是为什么我希望看到您迄今为止所尝试的内容。也许您只是在内容容器上缺少底部边距？问题是它没有实现！这些示例不包含带有滚动条的content-Order主div。它只是向下推页脚（不再粘性）或者主div的其余部分隐藏在页脚后面…谢谢你的努力！啊，你想要一个固定的页脚吗？试试position:absolute，bottom:0。这将使页脚始终位于底部（ipad、iPhone、android手机、平板电脑和其他移动设备除外）你能给我们看一下你的代码吗？我刚刚使用了这两个网站的代码。看到他们的代码是有效的，但当你试图实现它时，我忍不住觉得你的实现和你引用的源代码之间一定有不一致之处，这就是为什么我想看看你迄今为止所做的尝试。也许你只是错过了一个机会内容容器上的下边距？问题是它没有实现！这些示例不包含带有滚动条的content-Order main div。它只是将页脚向下推（不再粘滞）或者主div的其余部分隐藏在页脚后面…谢谢你的努力！啊，你想要一个固定的页脚吗？试试position:absolute，bottom:0。这将使页脚始终位于底部（ipad、iPhone、android手机、平板电脑和其他移动设备除外）这很好，但我有两个滚动条。一个用于整个页面，另一个用于内容分区。我只需要一个用于内容分区。在滚动内容时，我希望其余的保持不变。顺便说一句：我也尝试了Ryanfaits，但要么页脚“吃光”内容分区的底部-我希望它结束在页脚的正上方-或者发生与我的第一个解决方案相同的事情。有没有进一步的想法如何解决我的问题？再次谢谢！这很好，但我有两个滚动条。一个用于整页，一个较小的用于内容分区。我只需要一个用于内容分区。在滚动浏览时我希望其余的内容保持原样。顺便说一句：我也尝试了Ryanfaits，但要么页脚“吃掉”了内容分区的底部-我希望它结束在页脚的正上方-要么发生了与我的第一个解决方案相同的事情。有没有进一步的想法如何解决我的问题？再次谢谢！