css - 使用 Twitter Bootstrap 让页脚贴在页面底部

Question

我有一些内容不多的网页，页脚位于页面中间，但我希望它位于底部。

我已经把我所有的页面都放在一个“holder”里了

#holder {
  min-height: 100%;
  position:relative;
}

然后为我的页脚使用以下 CSS

ul.footer {
  margin-top: 10px;
  text-align: center;
}

ul.footer li {
  color: #333;
  display: inline-block;
}

#footer {
  bottom: -50px;
  height: 50px;
  left: 0;
  position: absolute;
  right: 0;
}

我的页脚的 html

<div class="container">
  <div class="row">
    <div class="span12">
      <div id="footer">
        <ul class="footer">
          <li>Website built by <a href="#">Fishplate</a></li>&nbsp;&nbsp;
          <li>Email:exampleemail@gmail.com</li>
        </ul>
      </div>
    </div>
  </div>
</div>

我想保持页脚流畅。

Answer 1

只需将类 navbar-fixed-bottom 添加到页脚即可。

<div class="footer navbar-fixed-bottom">

Bootstrap 4 更新 -

正如 Sara Tibbetts 所提到的——类是固定底部的

<div class="footer fixed-bottom">