JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<div id="test" style="display:flex;  flex-direction: column; width:300px; height:500px; border:1px solid #CCC">
<div id="bar" style="display:flex; width:100%; height:50px; background-color:#333">
</div>
<div id="body" style="display:flex;  flex-direction: column; width:100%; height:100%; border:1px solid #FF0000">
  <div style="display:flex; flex-direction: row; height:160px;  border:1px solid #00CC33">
    <div style="display:inline-block; flex-basis:auto; height:100%; border:1px solid #66BB33">
    </div>
    <div style="display:inline-block; flex-basis:160px; height:100%; border:1px solid #66BB33;">
    </div>
    </div>
  </div>
</div>

JavaScript

$(document).ready(function(){


});