JSFiddle - React, Tailwind, and code Playground

HTML

<div id="header">
    header.
    <br>
    Its height is dependant on what is inside it.
</div>    
<div id="content">
    content
</div>

CSS

html, body {
    height:100%;
    margin:0;
    padding:0;
}
#header {
    background-color:red;
    
}
#content {
    background-color:gray;
    height:100%;
    overflow-y:scroll;
}

JavaScript

$(function(){

    var contentHeight = $("body").height() - $("#header").height();
    
    $("#content").height( contentHeight );
    
});