Bootstrap 3 - 长右列 - 部分行

Chr*_*mes 5 twitter-bootstrap-3

我对Bootstrap很新,但不是12网格系统,但是我在实现比行长的列时遇到了问题.

我在网上搜索了一个公平的但是还没有找到答案!

如果可能的话,我会尝试制定我想要实现的目标!

第1行:[---- 12 ----]

第2行:[--- 9 ---] [3]

第3行:[3] [3] [3] [_] < - 从上面继续列.

我遇到的困难在于以下几点:

第1行,一切都好.第2行,一切都好.第3行,当开始第三行的第一列时,由于右栏中的内容很长,所以第三行的位置要低得多,而不是塞进去.

希望这是有道理的,并且可能有一个简单的解决方案,但是我的头现在疼,咖啡不再有效果了!

Bas*_*sen 5

使用嵌套来解决这个问题:http://getbootstrap.com/css/#grid-nesting

<div class="container">
  <div class="row">
    <div class="col-sm-12"></div>
  </div>
  <div class="row">
    <div class="col-sm-9">
      <div class="row">
        <div class="col-sm-12"></div>
      </div>
      <div class="row">
        <div class="col-sm-4"></div>
        <div class="col-sm-4"></div>
        <div class="col-sm-4"></div>
      </div>
    </div>
    <div class="col-sm-3"></div>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

请参阅:http://bootply.com/86710