twitter-bootstrap - 具有不同高度移动与桌面模式的引导推/拉柱

Question

我需要有关 Bootstrap 的推/拉列功能的帮助。

我有 3 个不同的部分，它们都可以有不同的高度。

在移动模式下，它们必须从 1 到 3 垂直显示，这很容易做到。

问题在于我想在桌面模式下获得的布局。我对桌面的需求是将它们显示在 2 个单独的列中（每列 50% 使用 col-md-6）。在左侧我想要第 2 部分，在右侧我想要第 1-3 部分。

移动的 ：

第 1 节

第 2 节

第 3 节

桌面 ：

第 2 节 第 1 节

没什么.. 第 3 节

我的问题是，当第 2 部分的高度高于第 1 部分的高度时，第 3 部分本身位于第 2 部分下方（即使显示在右侧）。我的需要是让第 3 部分刚好低于第 1 部分，无论第 2 部分的高度是多少。

感谢您提供的任何帮助。

这是代码：

<div class="row">

    <div class="col-md-6 col-md-push-6">
        Section 1
    </div>

    <div class="col-md-6 col-md-pull-6">
        Section 2
        <br />
        is taller than Section 1 with this 2nd line
    </div>

    <div class="col-md-6 col-md-push-6">
        Section 3 doesn't start right under Section 1
    </div>

</div>

标签： twitter-bootstrap