消除 tbody 标签之间的间隙

有没有办法消除slight两者之间的差距tbody标签当它们都像这样内联显示时？

http://jsfiddle.net/kttss/ http://jsfiddle.net/kttss/

正如您在小提琴中看到的那样，两个桌子之间有一个微小的间隙。我知道我可以通过使用负边距手动摆脱这个问题，但这似乎很麻烦，因为我有一个包含可变数量的表tbodys.

<table style="margin:0;" border="1">
   <tbody  style="display: inline-block;  margin:0;">
      <tr>
         <td>
            1
         </td>
         <td>
            2
         </td>
      </tr>
      <tr>
         <td>
            3
         </td>
         <td>
            4
         </td>
      </tr>
   </tbody>
   <tbody  style="display: inline-block; margin: 0;">
      <tr>
         <td>
            1
         </td>
         <td>
            2
         </td>
      </tr>
      <tr>
         <td>
            3
         </td>
         <td>
            4
         </td>
      </tr>
   </tbody>
</table>

看起来要添加border-spacing: 0;给你的table元素会有所帮助。如果没有这个，每个边框周围都有 2 个像素，这意味着表格之间有 4 个像素。