在行 - 流体中引导多行跨距

mac*_*erk 3 grid-layout fluid-layout twitter-bootstrap

这个问题非常相似,虽然它没有回答我的问题.

这样的答案会很好,只要它适用于响应式布局,例如.row-fluid,目前它不会.

在Bootstrap中是否有可能在该行中有一个流体行和多行,如下所示:

<div class="container-fluid">
    <div class="row-fluid">
        <div class="span12">
        </div>
        <div class="span12">
        </div>
        <div class="span12">
        </div>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

没有第二排跨度有一个奇数边缘左?

单击此处获取JSFiddle示例

基本上我需要的是.row-fluid在第一次打破布局之后在没有行的情况下在多个行内部有多行跨距.

Mas*_*ram 6

那么位移是由左边缘引起的.

这不是理想的,但你总是可以覆盖CSS:

.container-fluid .row-fluid [class*="span"] {
    margin-left:0px;
}
Run Code Online (Sandbox Code Playgroud)

但实际上,错误似乎在于你已经声明了12个span3 DIV,总计达到36个.12是流体容器的限制,所以你需要制作那些span1:

<div class="container-fluid">
    <div class="row-fluid">
        <div class="span1">1
        </div>
        <div class="span1">2
        </div>
        <div class="span1">3
        </div>
        <div class="span1">4
        </div>
        <div class="span1">5
        </div>
        <div class="span1">6
        </div>
        <div class="span1">7
        </div>
        <div class="span1">8
        </div>
        <div class="span1">9
        </div>
        <div class="span1">10
        </div>
        <div class="span1">11
        </div>
        <div class="span1">12
        </div>
    </div>
    <div class="row-fluid">
        <div class="span3">
            1
        </div>
        <div class="span3">
            2
        </div>
        <div class="span3">
            3
        </div>
        <div class="span3">
            4
        </div>
    </div>
    <div class="row-fluid">
        <div class="span3">
            1
        </div>
        <div class="span3">
            2
        </div>
        <div class="span3">
            3
        </div>
        <div class="span3">
            4
        </div>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

看这里:

http://jsfiddle.net/7Lu43/51/