JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
    <div class="left">
        <div>
            Some random irrelevant div that has fixed width of 220px no matter what and contians two divs.
        </div>
        <div>
            Ladidaaaa? Maybe? Lolz.
        </div>
    </div>
    <table class="right">
        <tr>
            <td> Table that should occupy the rest of the space </td>
            <td align="right"> and fluidly resize!</td>
        </tr>
         <tr>
            <td> Table that should occupy the rest of the space </td>
            <td align="right"> and fluidly resize!</td>
        </tr>
    </table>
</div>

CSS

.wrapper{
    border: 1px solid black;
    padding: 5px;
    width: 100%;
    max-width: 800px;
}

.left{
    border: 1px solid green;
    float: left;
    width: 220px;
}

.right{
    width: 100%;
    border: 1px solid red;
}