如何在没有最小高度，粘页脚或javascript的情况下将页脚保留在短页面的底部

Question

我有60页都有相同的页脚，包含在php中。内容量从300px到2000+不等。我不认为这是可能的，但是如果我可以让页脚坐在浏览器窗口的底部，如果页面比窗口短，并且行为正常（推到底部），那将是很好的，否则，只用CSS。感谢。

Answer 1

我知道这篇文章已经很老了，但我找到了一个很好的资源。

http://ryanfait.com/sticky-footer/

这里只是css：

* {
    margin: 0;
}
html, body {
    height: 100%;
}
.wrapper {
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -155px; /* the bottom margin is the negative value of the footer's height */
}
.footer, .push {
    height: 155px; /* .push must be the same height as .footer */
}

/*

Sticky Footer by Ryan Fait
http://ryanfait.com/

*/

祝你好运。

Answer 2

这是太晚了，答案与Barry P的答案有些相似。

对于你的包装器css类，添加以下内容，

  

min-height：calc（100vh - 155px）;

注意：这在IE8或更低版本中不起作用。

Answer 3

这是一篇甚至针对IE7的文章 当内容很少时，页脚会停留在底部 当有很多内容

时拖延

http://snipplr.com/view/15334/

Answer 4

我会尽量给你的内容一个最小高度说500px ......

#content {
   min-height: 500px;
}

这样，即使你只有300px的内容，500px（或者如果必要的话还要更长）会确保页脚被推得足够远，直到底部。

Answer 5

尝试将此添加到您的CSS

#footer {position: fixed; bottom: 0;}