Table cell borders disappear after loading in Chrome in Windows Desktop

My new website works very fine in mobile and laptop except in my desktop PC, where the table cell borders disappears once the website is fully loaded. After the page is fully loaded it displays only the outside border. I know that tables make lot of issues in WordPress, but I had to choose it anyway. My responsive table has got 3 columns and I am using Twenty Sixteen layout. I am using the following CSS code, but I think the issue has nothing to do with the coding.
table, tr, td {
border: 1px inset black;
border-collapse: collapse;
border-spacing: 0;
}
And the HTML code goes like this
<td>ABC</td>
<td>[embed]https://www.domain.com/Audio/a.mp3[/embed]</td>
<td>123</td>
</tr>
<tr>
<td>DEF</td>
<td>[embed]https://www.domain.com/Audio/b.mp3[/embed]</td>
<td>456</td>
</tr>
<tr>
<td>GHI</td>
<td>[embed]https://www.domain.com/Audio/c.mp3[/embed]</td>
<td>891</td>
</tr>
In my mobile and my laptop it displays all the borders perfectly. But in Windows desktop PC with Chrome, it shows the border at the time of loading, but once the page is fully loaded the cell borders get vanished. Even if I disconnect the internet connection, the cell borders come back again. I am so desperate now because I started off very well, did a lot of work, but all of it will be useless if it shows a weird design in the desktop computer which will ultimately affect my ranking in Google search.