JSFiddle - React, Tailwind, and code Playground
HTML
<table class="orig">
<tr><td>test</td><td>minimum width</td></tr>
</table>
<table class="orig">
<tr><td>this one is longer here</td><td>short</td></tr>
</table>
<table id="t1">
<tr><td>test</td><td data-min-width="300">minimum width</td></tr>
</table>
<table id="t2">
<tr><td>this one is longer here</td><td>short</td></tr>
</table>
CSS
table {
margin: 10px;
background: orange;
box-shadow: 3px 3px 10px #999;
-moz-box-shadow: 3px 3px 10px #999;
-webkit-box-shadow: 3px 3px 10px #999;
border: 5px solid blue;
border-top-radius: 5px;
}
.orig {
background: #ffdd00;
}
td {
border: 1px solid gray;
padding: 10px;
}
JavaScript
c0 = Math.max($("#t1 td").eq(0).width()+1,
$("#t2 td").eq(0).width()+1)
c1 = Math.max($("#t1 td").eq(1).width()+1,
$("#t2 td").eq(1).width()+1,
$("#t1 td").eq(1).data("min-width"))
$("#t1 td").eq(0).width(c0)
$("#t2 td").eq(0).width(c0)
$("#t1 td").eq(1).width(c1)
$("#t2 td").eq(1).width(c1)