JSFiddle - React, Tailwind, and code Playground

HTML

<html>
    <head>
    </head>
    <body>
        <table cellpadding="0" cellspacing="0" border="0" id="global_table">
            <tr>
                <td colspan="3" id="section_0">section 0</td>
            </tr>
            <tr>
                <td rowspan="2" id="section_1">section 1</td>
                <td colspan="2" id="section_2">section 2<div id="dragbar"></div></td>
            </tr>
            <tr>
                <td id="section_4">section 4</td>
                <td id="section_3">section 3</td>
            </tr>
        </table>
    </body>
</html>

CSS

html, body {height: 100%;}

#global_table {border-collapse:collapse; width: 100%; height: 100%;}

#section_0,
#section_1,
#section_2,
#section_3,
#section_4 {border: 1px solid #000000; font-weight: bold; text-align: center;}

#section_0 {padding: 20px 0px; height: 1%;}
#section_1 {}
#section_2 {}
#section_3 {}
#section_4 {}