JSFiddle - React, Tailwind, and code Playground

HTML

<table width="100%">
        <tr>

        <!-- basically I want the user to be able to manually resize the width of the <td>'s -->
            <td style="width:30%">
                <div class="resizable"><textarea style="width:100%; height:100%;"></textarea></div>
            </td>
            <td style="width:70%">
                <div class="resizable"><iframe style="width:100%; height:100%;" src=""></iframe></div>
            </td>
        </tr>
    </table>

CSS

td
    {
        position:relative;
    }
    .resizable
    {
        min-width:100%;
        min-height:100%;
        width:100%;
        height:100%;
        position:relative;
        display:inline-block;
        resize:both;
        overflow: hidden;
        border:1px solid blue;
        box-sizing: border-box;
    }