JSFiddle - React, Tailwind, and code Playground

HTML

<span id="tbl1_span" style="font-weight: bold;">Table 1</span>
<table id="tbl1" style="width: 100%">
    <thead style="color: #c00; font-weight: bold;">
        <tr>
            <th>
                Hello
            </th>
            <th>
                This
            </th>
            <th>
                Is
            </th>
            <th>
                A
            </th>
            <th>
                Test
            </th>
        </tr>
    </thead>
    <tbody>
                <tr>
            <td>
                Hello
            </td>
            <td>
                This
            </td>
            <td>
                Is
            </td>
            <td>
                A
            </td>
            <td>
                Test
            </td>
        </tr>
                <tr>
            <td>
                Hello
            </td>
            <td>
                This
            </td>
            <td>
                Is Actually Not
            </td>
            <td>
                Any Sort of a
            </td>
            <td>
                Test
            </td>
        </tr>
                <tr>
            <td>
                Hello
            </td>
            <td>
                This
            </td>
            <td>
                Is
            </td>
            <td>
                A
            </td>
            <td>
                Test
            </td>
        </tr>
                <tr>
            <td>
                Hello
            </td>
            <td>
                This
            </td>
            <td>
                Is
            </td>
            <td>
                A
            </td>
            <td>
                Test
            </td>
        </tr>
    </tbody>
</table>
<br /><br />
<span id="tbl2_span" style="font-weight: bold;"></span>

<div id="output">
</div>

CSS

.header_fixed {
    position: fixed;
    top: 0px;
    background-color:white;
}

JavaScript

var table_clone = $("#tbl1").clone()
.empty()
.append($("#tbl1 > thead").clone())
.addClass('header_fixed')
.css('left', $("#tbl1").offset().left)
.attr('id', $("#tbl1").attr('id') + '_clone');

$("#tbl2_span").after(table_clone);

$("#tbl1").find('tr').first().children().each(function(i, e)
{
   $($("#tbl1_clone").find('tr').children()[i]).width($(e).width());
});

$("#tbl1").find('tr').first().children().each(function(i, e)
{
   $("#output").append($(e).width() + ' -> ' + 
   $($("#tbl1_clone").find('tr').children()[i]).width() + '<br />');
});

$("#tbl1_clone").removeAttr('style');