JSFiddle - React, Tailwind, and code Playground

HTML

<div class="main">
  <div class="sub" id="sub1">&nbsp;</div>
  <div class="sub" id="sub2">&nbsp;</div>
</div>

CSS

.main{
    display: -webkit-flex;
    display: flex;

    -webkit-flex-flow: row nowrap; /* Safari 6.1+ */
    flex-flow: row nowrap; 
}

.sub{
    border: 1px black solid;
    flex-grow: 1;
}
#sub1{
    height: 300px;
    margin-right:50px;
}