Bootstrap - 如何正确排列两个tbody？

Question

我有一个问题，排队一张桌子并没有正常工作，我想知道以前是否有人处理过这样的事情。我查了一下，但找不到任何解决它的东西。我使用AngularJS和嵌套的ng-repeats，这就是为什么我遇到这个问题（并且需要将它们嵌套在表中）。我的代码如下：

<table class="table table-condensed table-hover table-responsive">
            <thead><tr>
                <th class="col-sm-4">1</th>
                <th class="col-sm-3">2</th>
                <th class="col-sm-3">3</th>
            </tr></thead>
            <tbody ng-repeat="blah in blah">
            <tr ng-repeat="blah2 in blah">
                <td>......</td>
            </tr>
            </tbody>
             <!--This is the end of "Table 1" in the diagram below-->
            <tbody ng-repeat="blah3 in blah4">
            <tr ng-repeat="blah5 in blah6">
              <td>.........</td>
            </tr>
            </tbody>
            <!--This is the end of "Table 2" in the diagram below-->
            </table>

我最终会得到这样的结果（请注意，我必须绘制它，因为我使用的表格数据是敏感信息）：

如何将第二个tbody（较小的一个）拉到第一个？

旁边？

由于

Answer 1

如果我理解正确，您可以简单地使用Bootstrap的列作为表的容器。例如：

div.col-md-6

将两个列一起渲染，直到屏幕崩溃。

https://jsfiddle.net/DTcHh/11692/

Answer 2

为什么不使用bootstrap的网格系统？

 <div class="row">
   <div class="col-md-4">.col-md-4</div>
   <div class="col-md-4">.col-md-4</div>
   <div class="col-md-4">.col-md-4</div>
 </div>

我不知道你想把什么放在桌子上，但你可以将它放入网格系统。 link to doc