JSFiddle - React, Tailwind, and code Playground
HTML
<div id="restricted">
<table>
<thead>
<tr>
<th>Header 1</th>
<th>Header 2</th>
<th>Header 3</th>
<th>Header 4</th>
<th>Header 5</th>
</tr>
</thead>
<tbody>
<tr>
<td>Row:1 Cell:1</td>
<td>Row:1 Cell:2</td>
<td>Row:1 Cell:3</td>
<td>Row:1 Cell:4</td>
<td>Row:1 Cell:5</td>
</tr>
<tr>
<td>Row:2 Cell:1</td>
<td>Row:2 Cell:2</td>
<td>Row:2 Cell:3</td>
<td>Row:2 Cell:4</td>
<td>Row:2 Cell:5</td>
</tr>
<tr>
<td>Row:3 Cell:1</td>
<td>Row:3 Cell:2</td>
<td>Row:3 Cell:3</td>
<td>Row:3 Cell:4</td>
<td>Row:3 Cell:5</td>
</tr>
<tr>
<td>Row:4 Cell:1</td>
<td>Row:4 Cell:2</td>
<td>Row:4 Cell:3</td>
<td>Row:4 Cell:4</td>
<td>Row:4 Cell:5</td>
</tr>
<tr>
<td>Row:5 Cell:1</td>
<td>Row:5 Cell:2</td>
<td>Row:5 Cell:3</td>
<td>Row:5 Cell:4</td>
<td>Row:5 Cell:5</td>
</tr>
<tr>
<td>Row:6 Cell:1</td>
<td>Row:6 Cell:2</td>
<td>Row:6 Cell:3</td>
<td>Row:6 Cell:4</td>
<td>Row:6 Cell:5</td>
</tr>
<tr>
<td>Row:1 Cell:1</td>
<td>Row:1 Cell:2</td>
<td>Row:1 Cell:3</td>
<td>Row:1 Cell:4</td>
<td>Row:1 Cell:5</td>
</tr>
<tr>
<td>Row:2 Cell:1</td>
<td>Row:2 Cell:2</td>
<td>Row:2 Cell:3</td>
...
CSS
thead th {
min-width: 125px;
}
#restricted {
width: 400px;
height: 300px;
border: 1px solid red;
overflow: auto;
overflow-x: hidden;
}