表格底部的额外行

时间:2016-09-07 10:47:47

标签: html css html-table

我的Wordpress页面中有3个表格,我使用内联块来水平显示它们。它们看起来很好,除了每个底部的一条奇怪的线条。

我花了很长时间试图搞清楚,但我做不到。任何帮助非常感谢。我将粘贴一个示例表和CSS。谢谢你的时间。

.summary {
  width: 32%;
  border: 1px solid #e9b3b3;
  border-radius: 10px;
  padding: 3px 3px 3px 3px;
  display: inline-block;
  vertical-align: top;
}

.summary th {
  border: 0px;
  padding: 3px;
}

.summary td {
  border: 0px;
  font-size: small;
  text-align: left;
  padding: 3px;
}
<table class="summary">
  <thead>
    <tr>
      <th colspan="2">Customer Service</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><img class="alignnone size-full wp-image-730" src="telephone.png"  alt="telephone" width="48" height="48" /></td>
      <td>01384 999 999</td>
    </tr>
    <tr>
      <td><img class="alignnone size-full wp-image-731" src="email.png" alt="email" width="48" height="48" /></td>
      <td>support@test.co.uk</a>    </td>
    </tr>
    <tr>
      <td><img class="alignnone size-full wp-image-732" src="text.png" alt="text" width="48" height="48" /></td>
      <td>Text HELP</td>
    </tr>
    <tr>
      <td><img class="alignnone size-full wp-image-733" src="support.png" alt="support" width="48" height="48" /></td>
      <td>Live Chat 24/7</td>
    </tr>
  </tbody>
</table>

0 个答案:

没有答案