尽管内容大小，如何使页脚粘到底部？

Question

我有这个CSS代码：

#main-wrapper {min-height: 300px;}

#main {}

.clearfix:after {content:".";display:block;height:0;clear:both;visibility:hidden;}

我试过：明确：两者;底部：0;位置是：固定;宽度：100％;对于页脚..

但它只适用于短内容显示..当页面内容太长时，我必须向下滚动页面页脚..

请帮助

Answer 1

see the example code here

HTML

<div id="main-wrapper">
    <div id="content"> content of any length</div>
    <div id="footer">Footer</div>
</div>

CSS

* {
    padding: 0;
    margin: 0;
}
#content {
    margin-bottom: 30px;/*same as footer height*/
}
#footer{
    position: fixed;
    bottom:0;
    height: 30px;
    background: #eee;
    width: 100%;
    text-align: center;
}