JSFiddle - React, Tailwind, and code Playground

HTML

<div id="whole">
<div id="topper">
test
</div>
<div id="bottommer">
test
</div>
</div>

CSS

#topper{
    height:100%;
    width:100%;
    background-color:blue;
}
#wrapperz{
    height:inherit;
    width:100%;
}
#wrapperz p{margin:0 0 0 0px; padding:10px 10px 0px 10px; color:#0F0F0F;}
#wrapperz #floatitleft{
    width:300px;
    float:left;
}
#wrapperz #floatitright{
    margin-left: 300px;
}
#bottommer{
    height:100px;
    width:100%;
    background-color:red;
}