JSFiddle - React, Tailwind, and code Playground

HTML

<div id="main" class="clear">
  <div id="sidebar"></div>
  <div id="page-wrap"></div>
</div>

CSS

#main {
    margin: auto;
    width: 400px;
}

#sidebar    {
    width: 100px;
    min-height: 400px;
    background: red;
    float: left;
}

#page-wrap  {
    width: 300px;
    background: #0f0;
    min-height: 400px;
    float: left;
}

.clear:after {
    clear: both;
    display: table;
    content: "";
}