JSFiddle - React, Tailwind, and code Playground

HTML

<table border="0" cellspacing="0" cellpadding="0">
<thead>
  <tr>
    <th>Test1</th>
    <th>Test2</th>
  </tr>
</thead>
<tbody>
  <tr>
    <td>Test1</td>
    <td>Test2</td>
  </tr>
</tbody>
</table>

CSS

table {
    border-collapse: collapse;
}

th, td {
  border: 1px solid red;
  margin: 0;
  padding: 5px;
}

thead th {
  position: relative;
  background: #f0f0f0;
  top: 10px;
}

thead th:after {
  content: '';
  position: absolute;
  background: #00f;
  left: -1px;
  right: -1px;
  bottom: 0;
  height: 1px;
}