JSFiddle - React, Tailwind, and code Playground

HTML

<div class="menu">Menu</div>
<div class="page">
  <div class="top">Top</div>
  <div class="content">
    <div class="left">
        <div class="l1"> <br><br><br>Left1 <br><br><br></div>
        <div class="l2"> <br><br><br>Left2 <br><br><br></div>
    </div>
    <div class="right">Right</div>
  </div>
</div>

CSS

body{margin: 0}
.page {
    display:flex;
    flex-direction: column;
    width: 100%;
    height: 200px;
    background-color:white;
}
.content{
    display: flex;
}
.left {
    background-color:lightgreen;
    display:flex;
    flex-direction: column;
}
.l1{
  flex: 1;
}
.l2{
  background-color:steelblue;
  overflow-y:auto;
}
.right {
    background-color: red;
}