桌子边界垂直和水平不会合

Question

我有一个简单的表格，我只是尝试在某些单元格周围设置边框。

＆＃13;

＆＃13;

.comments .b {
  border-bottom: 1px solid #919295;
}
.comments .t {
  border-top: 1px solid #919295;
}
.comments .l {
  border-left: 1px solid #919295;
}
.comments .r {
  border-right: 1px solid #919295;
}

＆＃13;

<table align='center' width='100%' class='comments'>
  <tr>    
    <th width='15%' class='r b'>val</th>
    <th width='45%'>ba</th>
    <th width='40%'>"sadf</th>
  </tr>   
  <tr>    
    <th width='15%' class='r b'>"dsf</th>
    <th rowspan='2' colspan='2'>"sdf</th>
  </tr>
  <tr height='60px'><th colspan='3'>&nbsp;</th></tr>
  <tr height='35px'><th>&nbsp;</th><th colspan='2'>&nbsp;</th></tr>
</table>

＆＃13;

＆＃13;

＆＃13;

结果是：

如何删除箭头指示的空格？

我试过了border-spacing: 0px;

Answer 1

添加

table {
  border-collapse: collapse;
}