2

对于我的 Rails 应用程序，我使用的是引导程序。当我将浏览器窗口的宽度缩小到大约 900 像素以下时，背景将停止扩展浏览器的整个宽度，每边大约有 20 像素的空间。我看了看这个（调整浏览器大小不能正确调整 div 大小 - 这么简单我做错了什么？）但仍然无法让它工作。

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

应用程序.js

//= require bootstrap

布局/_header.html.erb

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

样式.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;
}

调整大小之前：

图 1

调整大小后：

图二

4

1 回答 1

1

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

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

于 2013-05-26T05:02:36.510 回答