为什么Twitter Bootstrap"固定"布局没有修复?

leo*_*nel 2 css ruby ruby-on-rails twitter-bootstrap twitter-bootstrap-rails

Twitter Bootstrap网站内容如下:

默认和简单的940px宽,居中布局,适用于由单个网站或页面提供的任何网站或页面<div class="container">.

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

这正是我在HTML中所拥有的,但当我检查元素时,我看到这个CSS适用于它:

.container, .navbar-fixed-top .container, .navbar-fixed-bottom .container {
    width: 1170px;
}
Run Code Online (Sandbox Code Playgroud)

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

div.container{
  width:940px;
}
Run Code Online (Sandbox Code Playgroud)

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

那么,为什么Twitter Bootstrap"固定"布局不固定?以及如何修复它?

She*_*row 6

更新

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

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


这是因为您包含了响应式布局.检查文档

如果你看看这个文件github responsive-1200px-min.less(2.0.4)github responsive-1200px-min.less(2.1.0)

你可以看到

@gridColumnWidth: 70px; // First parameter
@gridGutterWidth: 30px; // Second parameter
Run Code Online (Sandbox Code Playgroud)

这给了70*12 + 30*(12-1) = 1170px(12是@gridColumns).

因此,如果您需要静态,无响应,940px宽的网格,则必须bootstrap-reponsive.css从包含中删除该文件.

至于RoR等价物,任何输入都是值得赞赏的.