Bootstrap 3制作浮动面板

Question

在bootstrap中，我有一个带有3个面板的网格结构，如附图所示：

<div class="row">
   <div class="col-md-3">
      <div class="panel">
         <!-- This is table panel on the left -->
      </div>
   </div>

   <div class="col-md-9">
      <div class="panel">
         <!-- Section 1 panel -->
      </div>
   </div>
<div>

<div class=" row">
   <div class="col-md-9 col-md-offset-3">
      <div class="panel">
         <!-- Section 2 panel -->
      </div>
   </div>
</div>

当然，随着表格中行数的增加，第3节面板出现故障......如何让第3节面板保持在第1节面板下方？

Answer 1

您可以在面板1之后移动面板3，如下所示：

<div class="row">
   <div class="col-md-3">
      <div class="panel">
         ...
         This is table panel on the left
         ...
      </div>
   </div>

   <div class="col-md-9">
      <div class="panel">
         ...
         Section 1 panel
        ...
      </div>
      <div class="panel">
         ...
         Section 2 panel
         ...
      </div>
   </div>
<div>