twitter-bootstrap - 在引导程序中创建行跨度

Question

我想用这个图像创建一个 boostrap 标记定义：

row1、row2 和 row3 共享相同的 div/列，我该怎么办？

如果我要进行表格设计，那么我会使用行跨度...

更新

较大窗口的不良调整行为（请参阅按钮）

使用较小的窗口更好地调整大小（参见按钮）

那是代码：

<div class="row">
    <div class="span6">
        <div class="row">
            <div class="span3">xxxxxxxxxxxx name</div>
            <div class="span3">
                <input type="text" class="text" />
            </div>
        </div>
        <div class="row">
            <div class="span3">xxxxxxxxxxxxxx from</div>
            <div class="span3">
                <input type="text" class="text" />
            </div>
        </div>
        <div class="row">
            <div class="span3">xxxxxxxxxxxx to</div>
            <div class="span3">
                <input type="text" placeholder="Please enter the end date" class="text" />
            </div>
        </div>
    </div>
    <div class="span3">
        <input type="checkbox" class="checkbox" value="Green melons" />LightBlue Peaaaas<br />
        <input type="checkbox" class="checkbox" value="Green melons" />Blue Melons<br />
        <input type="checkbox" class="checkbox" value="Green melons" />Red Apples<br />
        <input type="checkbox" class="checkbox" value="Green melons" />Yellow Bananas<br />
        <input type="checkbox" class="checkbox" value="Green melons" />Black Mushis<br />
        <input type="checkbox" class="checkbox" value="Green melons" />Pink Bermudas<br />
    </div>
    <div class="span3">
        <div class="row">
            <div class="span3">
                <span>First day of week</span>
            </div>
        </div>
        <div class="row">
            <div class="span3">
                <input type="radio" class="radio" />Monday
            </div>
        </div>
        <div class="row">
            <div class="span3">
                <input type="radio" class="radio" />Tuesday
            </div>
        </div>
    </div>
</div>

<div class="row">
    <div class="span12">
        <button class="btn pull-right">Next</button>
    </div>
</div>

更新

Jack 在 IE 10 上的小提琴也有不好的调整大小行为，你可以从进入左侧文本框的复选框判断：

Answer 1

尝试这个

<div class="row">
    <div class="span6">
        <div class="row">
            <div class="span3"></div>
            <div class="span3"></div>
        </div>
        <div class="row">
            <div class="span3"></div>
            <div class="span3"></div>
        </div>
        <div class="row">
            <div class="span3"></div>
            <div class="span3"></div>
        </div>
    </div>
    <div class="span3">
    </div>
    <div class="span3">
        <div class="row">
            <div class="span3"></div>
        </div>
        <div class="row">
            <div class="span3"></div>
        </div>
        <div class="row">
            <div class="span3"></div>
        </div>
    </div>
</div>

<div class="row">
    <div class="span12"></div>
</div>