如何在表之间腾出空间?

时间:2017-03-21 14:29:23

标签: css twitter-bootstrap

我有两张桌子。 一个在另一个之上。我在我的项目中使用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

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

1 个答案:

答案 0 :(得分:1)

使用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/