JSFiddle - React, Tailwind, and code Playground

HTML

<table class="tg">
  <tr>
    <th>XXXXXXXXXX</th>
    <th>A</th>
    <th>B</th>
    <th>C</th>
    <th>D</th>
  </tr>
  <tr>
    <td>E</td>
    <td>F</td>
    <td>G</td>
    <td>H</td>
    <td>I</td>
  </tr>
</table>

CSS

.tg  {
    border-collapse:collapse;
    border-spacing:0;
    margin:0px auto;
}
.tg td{
    font-family:Arial, sans-serif;
    font-size:14px;padding:20px 20px;
    border-style:solid;
    border-width:1px;
    overflow:auto;
}
.tg th{
    font-family:Arial, sans-serif;
    font-size:14px;
    font-weight:normal;
    padding:20px 20px;
    border-style:solid;
    border-width:1px;
    overflow:auto;
    max-width:50px;
}