JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
    <div id="box1">Box 1</div>
    <div id="box2">Box 2</div>
    <div id="box3">Box 3</div>
</div>

CSS

body{margin:0 auto;}

#container{width:100%;height:100%;background:#ccc;display:-webkit-flex;display:flex;flex-direction:column}

#box1 {background:red;height:50px}
#box2 {background:yellow;-webkit-flex:1;flex:1}
#box3 {background:green;height:50px}