css - 如何在表之间腾出空间？

我有两张桌子。
一个以上，我在项目中使用bootstrap 3.3.7。

这里的html声明代码：

 <!--Table 1-->
<table border="0" cellspacing="0" class="table" cellpadding="3" width="100%%">
  <tr>
    <td class="InfoText">בselect start and end point:</td>
  </tr>
  <tr>
    <td height="6"></td>
  </tr>
  <tr>
    <td class="InfoText">measure units:</td>
  </tr>
  <tr>
    <td>
      <select id="unitselect" name="UNITS" class="btn btn-default dropdown-toggle Ctrl" onchange="OnChangeUnits()">
        <option value="mi">kilimeters</option>
        <option value="km">__#DISTANCEKILOMETERS#__</option>
        <option value="usft">__#DISTANCEUSFEET#__</option>
        <option value="ft">__#DISTANCEFEET#__</option>
        <option value="m">__#DISTANCEMETERS#__</option>
      </select>
    </td>
  </tr>
</table>

 <!--Table 2-->
<table border="0" cellpadding="5">
  <tr class="RegText">
    <td>segments:</td>
    <td align="right" class="MeasureData"><span id="partial"></span></td>
    <td>(<span id="units1"> 0.00    meters</span>)</td>
  </tr>
  <tr class="RegText">
    <td>sum:</td>
    <td align="right" class="MeasureData"><span id="total"></span></td>
    <td>(<span id="units2"> 0.00    meters</span>)</td>
  </tr>
</table>

这是工作fiddler。

我的问题是如何在表之间腾出空间？

最佳答案

使用CSS：

https://jsfiddle.net/iorgu/DTcHh/31065/

table:first-child{
  margin-bottom: 20px; /*whatever distance you want between the two tables*/
}

编辑：

或使用HTML：

两个表之间的<br/>：

https://jsfiddle.net/iorgu/DTcHh/31067/