JSFiddle - React, Tailwind, and code Playground

HTML

<div id="sidebar">
   <div class="widget" style="background-color: red;">One</div>
   <div class="widget" style="background-color: yellow;">Two</div>
   <div id="rest" style="background-color: blue;">Three</div>
</div>

CSS

.html, .body { height: 100%; }

.sidebar {
    height: 100%;
}

.widget {
    height: 100px;
}

.rest {
    height: calc(100% - 200px);
}