JSFiddle - React, Tailwind, and code Playground

HTML

<table border=1>
  <tr>
    <th>abcdefghijklmnopqrstuvwxyz</th>
  </tr>
  <tr>
    <td>abcdefghujklmnopqrst</td>
  </tr>
</table>

CSS

table
{
  table-layout: fixed;
  width: 50px;
}
th
{
  overflow: hidden;
  word-wrap: break-word;
}
td
{
  overflow-x: scroll;
}