使用css将页脚定位在页面底部

Question

这是我在底部显示页脚的代码扩展链接

但不知道为什么它会在页脚和页面底部之间显示空格。

FIDDLE：JSFIDDLE

代码：

 <div id="footer">
            <div class="container">
                <div class="collapse navbar-collapse">
                    <ul class="nav navbar-nav">     
                        <li class="active"><a href="#">What is thenWat?</a></li>
                        <li><a href="#about">How does it work?</a></li>
                        <li><a href="#contact">Feedback</a></li>
                        <li><a href="#contact">Contact us</a></li>                            
                    </ul>
                </div><!--/.nav-collapse -->
            </div>
        </div>

css包含bootstrap.css和其他内联css

Answer 1

使用这个CSS，我打赌它会像魅力一样工作

bottom: 0px;
width: 100%;
position: fixed;

使用这个CSS，即使你调整窗口大小，也不会对它产生影响。这将始终保持您的页脚在底部。

Answer 2

#footer{
    height: 34px; /* Think about this height */
    /* ... */
}