JSFiddle - React, Tailwind, and code Playground
by Yaakov Ainspan
HTML
<table>
<thead>
<tr>
<th>Header</th>
<th>Header</th>
<th>Header</th>
<th>Header</th>
</tr>
</thead>
<tbody>
<tr>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
</tr>
<tr>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
</tr>
<tr>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
</tr>
<tr>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
</tr>
<tr>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
</tr>
<tr>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
</tr>
<tr>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
</tr>
<tr>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
</tr>
<tr>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
</tr>
<tr>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
</tr>
<tr>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
</tr>
<tr>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
</tr>
<tr>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
</tr>
<tr>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
</tr>
<tr>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
</tr>
<tr>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1 Item</td>
</tr>
<tr>
<td>#1 Item</td>
<td>#1 Item</td>
<td>#1...
CSS
table {
position: relative;
padding-top: 20px;
}
table thead {
position: absolute;
left: 0;
right: 0;
top: 0;
background: #fff;
}
table thead tr {
position: fixed;
background: #fff;
}