如何使用twitter bootstrap网格框架创建两个独立的列

Question

我想创建一个(或多或少Pinterest)网格布局,如下所示.两列具有不同的行,但是并排显示.如何使用twitter bootstrap网格框架执行此操作？

如果我没有弄错,正常的行/ col行为会给我下面的布局.

Answer 1

您应该能够通过使用两列本身具有行来实现布局:

<div class="row">
    <div class="col-xs-6">
        <div class="col-xs-12">1</div>
        <div class="col-xs-12">2</div>
        <div class="col-xs-12">
            <div class="row">
                <div class="col-xs-6">3</div>
                <div class="col-xs-6">4</div>
            </div>
        </div>
    </div>
    <div class="col-xs-6">
        <div class="col-xs-12">5</div>
        <div class="col-xs-12">
            <div class="row">
                <div class="col-xs-6">6</div>
                <div class="col-xs-6">7</div>
            </div>
        </div>
        <div class="col-xs-12">8</div>
    </div>
</div>

http://jsfiddle.net/zz4ug/