延长页脚以填充容器边缘的页面底部？ （从左到右或宽度）

Question

这是我的模板，我想在这个网站上填写页脚kars4kids.com（向下滚动到页脚）

.footer {
  padding: 180px 0;
  background-color: #222222;
  width:100%;

Answer 1

<footer>标记位于.container内。请将其从包装中取出，或将其更换为液体容器。

<footer>
  <div class="container">               <!-- This is the reason -->
    <div class="row">
      <div class="col-md-3 col-sm-6">

或者将其更改为container-fluid。

Answer 2

您需要使外部元素（页脚）占据整个宽度，并在内部放置另一个元素来保存您的内容并在中间正确格式化。

<footer>
  <div class="container">
     <!-- content -->
  </div>
</footer>

footer {
  background: #E5F4FE;
  padding: 0;
  margin: 0;
  display: block;
}

footer .container{
  width: 70%;
  max-width: 1050px;
  margin-right: auto;
  margin-left: auto;
}

我在这里创建了一个例子http://codepen.io/AVDW/pen/xVgLyO