JSFiddle - React, Tailwind, and code Playground

HTML

<table class="table_cols">

<tr>
<td class="td_cols">Col 1</td>
</tr class="table_scale_end">

<tr class="table_scale">
<td class="td_cols">Col 2</td>
</tr class="table_scale_end">

<tr class="table_scale">
<td class="td_cols">Col 3</td>
</tr class="table_scale_end">

<tr class="table_scale">
<td class="td_cols">Col 4</td>
</tr>

</table>

CSS

.table_cols
{
width:100%;
height:200px;
margin:auto;	
}

.td_cols
{
width:20%;
height:200px;
text-align:center;
background-color:green;	
}

.table_scale
{
display:;
}

.table_scale_end
{
display:;
}