JSFiddle - React, Tailwind, and code Playground

by TheSoundDefense

HTML

<div class="column">
		<div class="item1"><textarea></textarea></div>
		<div class="item2"><textarea></textarea></div>
	</div>

CSS

.column {
  display: flex;
  flex-direction: column;
  height: 500px;
}

.column .item1 {
  background-color: red;
  flex: 1 0 50%;
  overflow-y: scroll;
}

.column .item2 {
  background-color: blue;
  flex: 0 1 50%;
  overflow-y: scroll;
}

textarea {
  resize: vertical;
}