在浏览器底部划分

Question

我使用下面的代码来对齐浏览器底部的div

CSS：

/* using the child selector to hide the
following body css from IE6 and earlier */
html>body {
    background-color: yellow;
}

#footer {
    position:absolute;
    right:0;
    bottom:0;
    background-color:Yellow;
}

HTML：

<div id="footer">
 CCC
</div>

当页面适合页面时，这很有效：

但是当页面长度超过时，如果我滚动页面，div也会滚动到顶部：

我已将页脚div放在顶部顶部用户控件上。页脚div之后还有一些其他控件。这会导致这个问题吗？

Answer 1

#footer {
    position: fixed;
    right:0;
    bottom:0;
    background-color:Yellow;
}

绝对是相对于html主体的绝对值，而固定是相对于框架

position tag are here的差异和其他值。

Answer 2

使用粘性页脚CSS：http://www.cssstickyfooter.com/

Answer 3

您应该使用固定位置而不是绝对。 使用此代码：

/* using the child selector to hide the
following body css from IE6 and earlier */
html>body {
    background-color: yellow;
}

#footer {
    position:fixed;
    right:0;
    bottom:0;
    background-color:Yellow;
}

Answer 4

您是否正在寻找此http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page？