JSFiddle - React, Tailwind, and code Playground

HTML

<div id="main">
  <div id="top">Top</div>
  <div id="bottom">Bottom</div>
</div>

CSS

#main {
  height: 100vh;
  display: grid;
  grid-template-rows: auto 1fr;
}

#top {
  height: 75vh;
  resize: vertical;
  overflow: auto;
  background-color: lightgreen;
}

#bottom {

  background-color: orangered;
}

body {
  margin: 0;
}