Have you noticed how the left border of the first cell doesn't line up with the margin area of the table?
This peculiar phenomenon seems to occur only in the first row:
https://i.stack.imgur.com/qMWCh.jpg
In all other rows, the border aligns properly with the margin area as expected:
https://i.stack.imgur.com/9wQ6x.jpg
The dark border visible in the images is the table container and the table's margin-left is set at 0px. The collapse border model is being used.
body{
margin-left:50px;
border:2px solid grey;
}
table{
border-collapse:collapse;
margin-left:0px;
}
.cellborder{
border-left:20px solid orange;
}
td{
background-color:gainsboro;
}
<table>
<tr>
<td class="cellborder">data1</td>
</tr>
<tr>
<td class="">data2</td>
</tr>
<tr>
<td>data3</td>
</tr>
</table>