Boostrap - 在第一个断点处将col-md-3拉到col-md-6上方

时间:2016-08-05 15:47:34

标签: twitter-bootstrap-3

我有两列:

<div class="col-md-9">
    ...main content here
</div>
<div class="col-md-3">
    ...sidebar content here
</div>

我希望右侧的col-md-3直到第一个断点,然后在较小的视口之后。我玩弄推拉柱子,但无法弄清楚如何正确显示。请指教。

1 个答案:

答案 0 :(得分:0)

这应该这样做。 Demo

这个想法是顶级div总是突破。由于我们希望顶部div位于正确的位置,我们将其向右推动另一列的偏移量为9.然后我们将底部div拉回3列以将其置于左侧位置。

<div class="col-md-3 col-md-push-9">
    ...sidebar content here
</div>
<div class="col-md-9 col-md-pull-3">
    ...main content here
</div>