Bootstrap - 调整浏览器大小时背景确实扩展了 100% 宽度

Question

对于我的 rails 应用程序，我使用的是引导程序。当我将浏览器窗口的宽度缩小到大约 900 像素以下时，背景将停止扩展浏览器的整个宽度，每边大约有 20 像素的空间。我看了看这个（resizing browser does not resize div correctly - so simple what am I doing wrong?），但仍然无法让它工作。

问题：如何调整代码，以便当我将浏览器窗口宽度调整到 X 量以下时，它不会创建空间？

应用程序.js

//= require bootstrap

layouts/_header.html.erb

<div class = "middlebar">
  <div class="container">
    <p class="navbar-text">
        Hello World!
    </p>
  </div>
</div>

styles.css.scss

.middlebar {
  padding: 0px 0;
  text-align: left;
  background-color: #f5f5f5;
  border-top: 1px solid #fff;
  border-bottom: 2px solid #ddd;
  margin-bottom: -20px;
}

调整大小之前：

调整大小后：

Answer 1

Twitter bootstrap 有一个名为“responsive.css”的文件，媒体查询有一条规则，即小于 767px 宽度的整个容器 div 获得 100% 宽度，而 body 获得大约 20px 的 padding-left 和 padding-right ，只需删除规则的那一行，你就会得到你想要的结果......

只是因为您担心20px 对手机有好处，所以在删除它之前请三思而后行。