JSFiddle - React, Tailwind, and code Playground

HTML

<div id="wrapper">
    <div id="left"></div>
    <div id="middleColumn">
        <div id="middleTop"></div>
        <div id="middleBottom"></div>
    </div>
    <div id="right"></div>
</div>

CSS

#wrapper{height:300px;width:300px;}
#left,#middleColumn,#right{height:100%;width:33.33%;float:left;}
#middleTop,#middleBottom{height:50%;width:100%;}

#left{background-color:blue;}
#middleTop{background-color:green;}
#middleBottom{background-color:yellow;}
#right{background-color:red;}