JSFiddle - React, Tailwind, and code Playground

by thirdender

HTML

<div>
  <div>
    <div>
      Line #0<br />
      Line #1<br />
      Line #2<br />
      Line #3<br />
      Line #4<br />
    </div>
  </div>
  <div>
    <div>
      Top
    </div>
    <div>
      <div>
        Line #0<br />
        Line #1<br />
        Line #2<br />
        Line #3<br />
        Line #4<br />
      </div>
    </div>
  </div>
</div>

SCSS

body > div {
  display: flex;
  > div {
    display: flex;
    flex-direction: column;
    border: 1px solid black;
    margin: 10px;
    > div + div {
      background: green;
      width: 8em;
      flex: 1;
      position: relative;
      > div {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        overflow: auto;
      }
    }
  }
}