表格边框会渗入Chrome中的相邻单元格

Question

我在Chrome浏览器中遇到了一个奇怪的问题，边界流到了相邻的单元格中。

这就是我希望它的外观以及它在Firefox中的显示方式

这就是它在Chrome中的显示方式

什么原因导致该边界渗入另一个单元格？

    .myTable{
        border:0;
        padding:0;
        border-spacing:0;
        border-collapse:collapse;
        table-layout:fixed;
        width:280pt;
    }

    .leftTopRight{
        border-width:0.5pt 0.5pt 0 0.5pt;
        border-color: black;
        border-style: solid;    
        text-align:center;
    }
    .leftRight{
        border-width:0 0.5pt 0 0.5pt;
        border-color: black;
        border-style: solid;
        text-align:center;  
    }
    .allAround{
        border-width:0.5pt;
        border-color: black;
        border-style: solid;
        text-align:center;      
    }
    .leftRightBottom{
        border-width:0 0.5pt 0.5pt 0.5pt;
        border-color: black;
        border-style: solid;    
        text-align:center;
    }
     td {
         color:black;
         font-size:11pt;
         font-weight:400;
         font-style:normal;
         text-decoration:none;
         font-family:Calibri, sans-serif;
         vertical-align:bottom;
         white-space:nowrap;
    }

<table class="myTable">
  <tr class="singleHeight">
    <td colspan=6 class="leftTopRight">Number</td>
  </tr>
  <tr class="singleHeight">
    <td colspan=6 class="leftRight">&nbsp;</td>
  </tr>
  <tr class="singleHeight">
    <td colspan=1 class="allAround">z</td>
    <td colspan=5 class="leftRightBottom">1018</td>
  </tr>  
</table>

https://jsfiddle.net/fbt1nwv7/

Answer 1

移除192，并移除border-collapse:collapse的左侧边框（这样您就不会在两个单元格相交处获得双倍宽度的边框。）

.leftRightBottom

    .myTable{
        border:0;
        padding:0;
        border-spacing:0;
        /*border-collapse:collapse;*/
        table-layout:fixed;
        width:280pt;
    }

    .leftTopRight{
        border-width:0.5pt 0.5pt 0 0.5pt;
        border-color: black;
        border-style: solid;    
        text-align:center;
    }
    .leftRight{
        border-width:0 0.5pt 0 0.5pt;
        border-color: black;
        border-style: solid;
        text-align:center;  
    }
    .allAround{
        border-width:0.5pt;
        border-color: black;
        border-style: solid;
        text-align:center;      
    }
    .leftRightBottom{
        border-width:0 0.5pt 0.5pt 0;
        border-color: black;
        border-style: solid;    
        text-align:center;
    }
     td {
         color:black;
         font-size:11pt;
         font-weight:400;
         font-style:normal;
         text-decoration:none;
         font-family:Calibri, sans-serif;
         vertical-align:bottom;
         white-space:nowrap;
    }