如何将表格单元格边距设置为0？ [复制]

Question

在水平方向上，我试图用“-”将左右单元格粘合在一起，它们之间没有任何空白。所以我厌倦了在它们之间创建一个内容为“-”的中间单元格，但它在三个单元格之间有边距，所以我想知道如何摆脱中间单元格和其他细胞？

HTML

<table id="test">
    <tr id="userr1">
        <th>Left</th>
        <th class="mid">-</th>
        <th>Right</th>
    </tr>
    <tr id="row1">
        <td>cell</td>
        <td class="mid">-</td>
        <td>cell</td>
    </tr>
    <tr id="row2">
        <td>cell</td>
        <td class="mid">-</td>
        <td>cell</td>
    </tr>
</table>

还有 CSS：

#test, th, td {
    border: 1px solid black;
    margin: 0px;
}
.mid {
    border: none;
    padding: 0px;
    margin: 0px;
}

Answer 1

试试这个https://jsfiddle.net/2Lzo9vfc/84/

table {
  border-collapse: collapse;
  border-spacing: 0;
}

Answer 2

您缺少填充：0px；对于

test, th, td {}

#test, th, td {
border:1px solid black;
margin:0px;
padding:0px;
  
}