为了账号安全,请及时绑定邮箱和手机立即绑定

即使有滚动条,也让div始终保持在页面内容的底部

即使有滚动条,也让div始终保持在页面内容的底部

PIPIONE 2019-07-29 11:24:45
CSS将Div推送到页面底部请查看该链接,我想要相反:当内容溢出到滚动条时,我希望我的页脚始终位于页面的完整底部,如Stack Overflow。我有一个div id="footer"和这个CSS:#footer {     position: absolute;     bottom: 30px;     width: 100%;}但它所做的只是转到视口的底部,即使向下滚动也会停留在那里,因此它不再位于底部。图片: 对不起,如果不澄清,我不希望它被修复,只是因为它在所有内容的实际底部。
查看完整描述

3 回答

?
慕尼黑5688855

TA贡献1848条经验 获得超2个赞

刚刚找到另一个解决方案,如上例所示,我有bug(某处错误)。所选答案的变化。

html,body {
    height: 100%}#nonFooter {
    min-height: 100%;
    position:relative;
    /* Firefox */
    min-height: -moz-calc(100% - 30px);
    /* WebKit */
    min-height: -webkit-calc(100% - 30px);
    /* Opera */
    min-height: -o-calc(100% - 30px);
    /* Standard */
    min-height: calc(100% - 30px);}#footer {
    height:30px;
    margin: 0;
    clear: both;
    width:100%;
    position: relative;}

对于HTML布局

<body>
    <div id="nonFooter">header,middle,left,right,etc</div>
    <div id="footer"></div></body>

那么这种方式不支持旧浏览器,但旧浏览器可以接受滚动下载30px来查看页脚


查看完整回答
反对 回复 2019-07-29
  • 3 回答
  • 0 关注
  • 1724 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信