JSFiddle - React, Tailwind, and code Playground

HTML

<div class="header">Header</div>

<div class="sidebar">This is the sidebar</div>

<div class="tablewrapper">
    
    <div class="tableheader-controls-etc"></div>
    <div class="tablewrap">table</div>
    
    
 
</div>

CSS

.header { height: 50px; background:black; color:white; }

.sidebar { height:100%; position:fixed; width 200px; background:gray; color:white; }

.tablewrapper{ float:right; width:75%; border:1px solid; margin-top:30px; margin-right:30px;}

.tableheader-controls-etc { height:150px; background:blue; color:white; }

.tablewrap {
    position: absolute;
    top: 240px;
    bottom:0;
    left: 150px;
    right: 40px;
    border: 2px solid red; overflow:auto;}