JSFiddle - React, Tailwind, and code Playground

HTML

<table border="1" >
        <tr>
            <td width="50%">
                This box has a lot of text.   This box has a lot of text.  This box has a lot of text.  This box has a lot of text.  This box has a lot of text.  This box has a lot of text.  This box has a lot of text.  This box has a lot of text.  This box has a lot of text.  This box has a lot of text.
                <div class="box">
                      
                </div>
            </td><td width="50%">
                This box has a little text.
                <div class="box">
                    
                </div>
            </td>            
        </tr>
        </table>

CSS

td
{
    padding:0px;
    vertical-align:top;
    position:relative;
}

.box
{
    margin:0px;
    border:solid 2px red;
    position:absolute;
    top:0px;
    bottom:0px;
    left:0px;
    right:0px;
}