Javascript 如何在引导网格系统中使用表

我的目标是展示4张桌子，它们彼此靠近，而不是在彼此下面 像这样：

table 1 , table 2, table 3, table 4

table1
table2
table3
table4

我已经尝试用一个“行”来实现网格系统，正如bootstrap的API所说的，但是对于一些人来说，我的结果是这样显示的：

table 1 , table 2, table 3, table 4

table1
table2
table3
table4

这是我的代码：（它只有两个表，但仍然有相同的坏结果）：

时辰
玩家1
玩家2
{{court.id}
{{court.hour}
{{court.date}
时辰
玩家1
玩家2
{{court.id}
{{court.hour}
{{court.date}

---

请帮帮我……

这是两张桌子的大致意思

<!--// put it in a container //-->
<div class="container">
  <div class="row">
    <div class="span4">
      <table class="table table-condensed table-bordered">
        <tr>
          <th>Hour</th>
          <th>Player 1</th>
          <th>Player 2</th>
        </tr>
        <tr ng-repeat="court in courts">
          <td>{{court.id}}</td>
          <td>{{court.hour}}</td>
          <td>{{court.date}}</td>
        </tr>
        <!--// close your tables //-->
      </table>
    </div>
    <div class="span4">
      <table class="table table-condensed table-bordered">
        <tr>
          <th>Hour</th>
          <th>Player 1</th>
          <th>Player 2</th>
        </tr>
        <tr ng-repeat="court in courts">
          <td>{{court.id}}</td>
          <td>{{court.hour}}</td>
          <td>{{court.date}}</td>
        </tr>

      </table>
    </div>
  </div>
</div>

时辰
玩家1
玩家2
{{court.id}
{{court.hour}
{{court.date}
时辰
玩家1
玩家2
{{court.id}
{{court.hour}
{{court.date}

---

+1为好的演示。实际上，我使用ng网格，但对于跨度为3的4个表来说，这足够好了，谢谢。真不敢相信我忘了关桌子。。非常感谢：）