css - 为什么 Twitter Bootstrap "fixed"布局未修复？

Question

Twitter Bootstrap 网站内容如下:

The default and simple 940px-wide, centered layout for just about any website or page provided by a single <div class="container">.

引自 http://twitter.github.com/bootstrap/scaffolding.html#layouts

这正是我的 HTML 中的内容，但是当我检查该元素时，我看到此 CSS 应用于它:

.container, .navbar-fixed-top .container, .navbar-fixed-bottom .container {
    width: 1170px;
}

顺便说一句，如果我通过添加...覆盖该 CSS 规则

div.container{
  width:940px;
}

然后 div.container 中的元素比 div.container 本身更宽，看起来不合适。

那么，为什么 Twitter Bootstrap 的“固定”布局不是固定的？我怎样才能修复它？

Answer 1

更新

在较新版本的 bootstrap 中，从 2.1.0(我认为)开始，您可以在 variables.less 中修改响应式网格大小:source on github

因此，如果您从 Less 编译 CSS，则可以修改这些变量。否则，下面的解决方案仍然有效。

---

这是因为您包含了响应式布局。检查doc

如果您查看此文件 github responsive-1200px-min.less (2.0.4)或 github responsive-1200px-min.less (2.1.0)

你可以看到

@gridColumnWidth: 70px; // First parameter
@gridGutterWidth: 30px; // Second parameter

70*12 + 30*(12-1) = 1170px(12 是 @gridColumns)。

因此，如果您想要静态的、无响应的、940 像素宽的网格，则必须从您的包含文件中删除 bootstrap-reponsive.css 文件。

至于与之对应的 RoR，欢迎任何意见。