JSFiddle - React, Tailwind, and code Playground

HTML

<input type='button' value='Resize!' />
<table id='t_head'>
<tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
    <td>5</td>
</tr>
</table>
<div>
<table id='t_body'>
<tr>
    <td>Column 1</td>
    <td>Column Column 2</td>
    <td>Column 3</td>
    <td>Column Column Column 4</td>
    <td>Column 5</td>
</tr>
<tr>
    <td>Column 1</td>
    <td>Column Column 2</td>
    <td>Column 3</td>
    <td>Column Column Column 4</td>
    <td>Column 5</td>
</tr>
<tr>
    <td>Column 1</td>
    <td>Column Column 2</td>
    <td>Column 3</td>
    <td>Column Column Column 4</td>
    <td>Column 5</td>
</tr>
<tr>
    <td>Column 1</td>
    <td>Column Column 2</td>
    <td>Column 3</td>
    <td>Column Column Column 4</td>
    <td>Column 5</td>
</tr>
<tr>
    <td>Column 1</td>
    <td>Column Column 2</td>
    <td>Column 3</td>
    <td>Column Column Column 4</td>
    <td>Column 5</td>
</tr>
<tr>
    <td>Column 1</td>
    <td>Column Column 2</td>
    <td>Column 3</td>
    <td>Column Column Column 4</td>
    <td>Column 5</td>
</tr>
<tr>
    <td>Column 1</td>
    <td>Column Column 2</td>
    <td>Column 3</td>
    <td>Column Column Column 4</td>
    <td>Column 5</td>
</tr>
<tr>
    <td>Column 1</td>
    <td>Column Column 2</td>
    <td>Column 3</td>
    <td>Column Column Column 4</td>
    <td>Column 5</td>
</tr>
<tr>
    <td>Column 1</td>
    <td>Column Column 2</td>
    <td>Column 3</td>
    <td>Column Column Column 4</td>
    <td>Column 5</td>
</tr>
<tr>
    <td>Column 1</td>
    <td>Column Column 2</td>
    <td>Column 3</td>
    <td>Column Column Column 4</td>
    <td>Column 5</td>
</tr>
<tr>
    <td>Column 1</td>
    <td>Column Column 2</td>
    <td>Column 3</td>
    <td>Column Column Column 4</td>
    <td>Column 5</td>
</tr>
<tr>
    <td>Column 1</td>
    <td>Column Column 2</td>
    <td>Column 3</td>
    <td>Column Column Column 4</td>
    <td>Column 5</td>
</tr>
<tr>
    <td>Column 1</td>
    <td>Column Column 2</td>
    <td>Column 3</td>
    <td>Column Column Column...

CSS

table, td {
    border: 1px solid black;
}
td {
    text-align: center;
}
div {
    height: 200px;
    overflow-x: hidden;
    overflow-y: auto;
}

JavaScript

function adjustHeader() {
    var t_head_cells;
    t_head_cells = $('#t_head').find('td');
    
    $('#t_body tr').eq(0).find('td').each(function(index,em) {
        $(t_head_cells[index]).css('width', $(em).outerWidth() - (1));
    });
}
$(document).ready(function() {
    $('input[type=button]').click(function() {
        adjustHeader();
    });
     t_head_cells = $('#t_head').find('td');
    
    $('#t_body tr').eq(0).find('td').each(function(index,em) {
        $(t_head_cells[index]).css('width', $(em).outerWidth() - (1));
    });
});