JSFiddle - React, Tailwind, and code Playground

HTML

<main>
  <content>
    main
  </content>
  <aside>
    side
    1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br>10000<br>
    1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br>10000<br>
  </aside>
</main>

CSS

html, body, main {
  height: 100%;
  margin: 0;
}

main {
  display: flex;
  flex-flow: row wrap;
  overflow: scroll;
}
content {
  min-width: 300px;
  flex: 9999 1 auto;
  background-color: #ffa;
}
aside {
  flex: 1 1 auto;
  overflow: scroll;
  background-color: #aff;
}