JSFiddle - React, Tailwind, and code Playground

HTML

<body>
Table One
    <table border="1" cellpadding="2"  cellspacing="2" style="border:solid 1px red">
        <tr>
            <td>
                Row 1 Col1
            </td>
            <td>
                Row 1 Col22222
            </td>
            <td>
                Row 1 Col 3333333
            </td>
        </tr>
        <tr>
            <td>
                Row 2 Col1
            </td>
            <td>
                Row 2 Col22222
            </td>
            <td>
                Row 2 Col 3333333
            </td>
        </tr>
    </table>
    <br/>
Table Two    
    <table  border="1" cellpadding="2"  cellspacing="2" style="border:solid 1px blue">
        <tr>
            <td>
                Row 1 Col1
            </td>
            <td>
                Row 1 Col22222
            </td>
            <td>
                Row 1 Col 3333333
            </td>
            <td>
                Row 1 Col with very very large content to show how the grid width expands
            </td>
        </tr>
        <tr>
            <td>
                Row 2 Col1
            </td>
            <td>
                Row 2 Col22222
            </td>
            <td>
                Row 2 Col 3333333
            </td>
            <td>
                Row 2 Col with large content to show how the grid width expands
            </td>
        </tr>
    </table>
</body>