JSFiddle - React, Tailwind, and code Playground

HTML

<table>
    <tr>
        <td class="first"><a href="#">aa</a></td>
        <td class="second"><a href="#">aaaaaaaaaaaaa</a></td>
        <td class="third"><a href="#">aaaa aaaaaaaaaaaaa</a></td>
    </tr>
</table>

CSS

table { width: 400px; }
td { border: 1px solid #d3d3d3; text-align: center;}
.first { padding: 0 3em; }
.second { padding: 0 2em; }
.third { padding: 0 4em; }