JSFiddle - React, Tailwind, and code Playground

HTML

<div id="wrapper">
    <div id="first"></div>
    <div id="second"></div>
</div>

CSS

html, body {
    width:100%;
    height:100%;
    margin:0;
}
#wrapper {
    width:300px;
    height:100vh;
    position:relative;
    display: flex;
    flex-direction: column;
    align-items: stretch;
}
#first {
    width:300px;
    height:200px;
    background-color:#F5DEB3;
}
#second {
    background-color:red;
    flex-grow:1;
}