JSFiddle - React, Tailwind, and code Playground

HTML

<table id="theHeader">
        <thead>
            <tr>
                <th>Test</th>
                <th>Test</th>
                <th>Test</th>
                <th>Test</th>
            </tr>
        </thead>
    </table>

    <table id="theContent">
        <tbody>
            <tr>
                <td>Testing</td>
                <td>Testing goes here</td>
                <td>Testing something</td>
                <td>Testing even more here yeah</td>
            </tr>
        </tbody>
    </table>

CSS

td,
th
{
    padding: 0.2em;
}

JavaScript

var headerColumns = $('#theHeader thead tr:first-child th');
    var contentColumns = $('#theContent tbody tr:first-child td');

    for(i=0; i<contentColumns.length; i++){
        $(headerColumns[i]).css('width',$(contentColumns[i]).width()+'px');
    }