JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
    <div id="titlebar">sdfsdf<br/>sdfsd<br/>sdfsdf</div>
    <div id="body">
        <div>adipiscing elit. Donec condimentum pretium nisl.
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec condimentum pretium nisl.
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec condimentum pretium nisl.
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec condimentum pretium nisl.
    
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec condimentum pretium nisl.Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec condimentum pretium nisl.
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec condimentum pretium nisl.Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec condimentum pretium nisl.
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec condimentum pretium nisl.
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec condimentum pretium nisl.
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec condimentum pretium nisl.
    
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec condimentum pretium nisl.Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec condimentum pretium nisl.
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec condimentum pretium nisl.
        </div></div>
        <div id="titlebar">abc<br/>sdfsd<br/>sdfsdf</div>
</div>

CSS

#container {height: 100px; width: 100px; border: solid; }
  #titlebar { background: gray;}
  #body { overflow: auto; background: lightblue;}  

/* CSS overrunned */
html, body {height:100%;width:100%;margin:0;}
#container {display:table;height:100%;width:100%;}
#titlebar, #body {display:table-row;height:100%;}
/* overwrite height of titlebar */
#titlebar{height:auto;}
div div {overflow:auto;height:100%;}