JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    <div class="header">
      header
    </div>
    <div class="scroll">
      <div>scroll</div>
      <div>scroll</div>
      <div>scroll</div>
      <div>scroll</div>
      <div>scroll</div>
      <div>scroll</div>
      <div>scroll</div>
      <div>scroll</div>
      <div>scroll</div>
      <div>scroll</div>
      <div>scroll</div>
    </div>
  </div>

CSS

div {
  border: 1px solid #DDD;
}
.container {
  max-height: 150px;
  display: flex;
  flex-direction:column;
}
.header {
  height: 40px;
}
.scroll {
  max-height: inherit;
  overflow: auto;
}