JSFiddle - React, Tailwind, and code Playground

HTML

<table>
    <tr>
        <td class='col1' id='firstCol_01'>col1</td>
        <td class='otherCols'>col2</td>
        <td class='otherCols'>col3</td>
        <td class='otherCols'>col4</td>
    </tr>
</table>

CSS

.col1{
    width:fit-content;    
}

table{
    background-color: gray;
}
td{
    border:1px solid white;
    color: yellow;
    text-align:center;
}

JavaScript

var tableSize = 400;
var firstCol = document.getElementById('firstCol_01');
var sizeOfFirstCol = firstCol.offsetWidth;
var myOtherCols = document.getElementsByTagName('td');
var nbcols = myOtherCols.length;
var sizeOtherCols = (tableSize-sizeOfFirstCol)/(nbcols-1);
for(var i=0;i<nbcols; i++)
{
    if(myOtherCols[i].className === 'otherCols')
    {
        myOtherCols[i].style.width = sizeOtherCols+'px';
    }
}