JSFiddle - React, Tailwind, and code Playground

HTML

<div class="tableWrapper">
  <div class="textArea">
    <textarea></textarea>
  </div>
  <div class="content">
    <h1>content</h1>
    <div>
      <p>
        Quisque eget ipsum lectus. Morbi ac vulputate velit. Phasellus condimentum nec orci eget sodales. Curabitur commodo ornare consequat. Proin vehicula mattis odio at feugiat. Nunc enim mi, viverra ut enim condimentum, malesuada fermentum felis. Aliquam
        erat volutpat. Fusce volutpat neque eget suscipit lobortis. Quisque eget ipsum lectus. Morbi ac vulputate velit. Phasellus condimentum nec orci eget sodales. Curabitur commodo ornare consequat. Proin vehicula mattis odio at feugiat. Nunc enim
        mi, viverra ut enim condimentum, malesuada fermentum felis. Aliquam erat volutpat. Fusce volutpat neque eget suscipit lobortis. Quisque eget ipsum lectus. Morbi ac vulputate velit. Phasellus condimentum nec orci eget sodales. Curabitur commodo
        ornare consequat. Proin vehicula mattis odio at feugiat. Nunc enim mi, viverra ut enim condimentum, malesuada fermentum felis. Aliquam erat volutpat. Fusce volutpat neque eget suscipit lobortis.
      </p>
      <p>
        Quisque eget ipsum lectus. Morbi ac vulputate velit. Phasellus condimentum nec orci eget sodales. Curabitur commodo ornare consequat. Proin vehicula mattis odio at feugiat. Nunc enim mi, viverra ut enim condimentum, malesuada fermentum felis. Aliquam
        erat volutpat. Fusce volutpat neque eget suscipit lobortis. Quisque eget ipsum lectus. Morbi ac vulputate velit. Phasellus condimentum nec orci eget sodales. Curabitur commodo ornare consequat. Proin vehicula mattis odio at feugiat. Nunc enim
        mi, viverra ut enim condimentum, malesuada fermentum felis. Aliquam erat volutpat. Fusce volutpat neque eget suscipit lobortis. Quisque eget ipsum lectus. Morbi ac vulputate velit. Phasellus condimentum nec orci eget sodales. Curabitur commodo
        ornare consequat. Proin vehicula mattis odio at feugiat. Nunc enim mi, viverra ut enim...

CSS

*{box-sizing:border-box;}
html,
body {
  height: 100%;
  width:100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
}
.tableWrapper {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: darkgrey;
  table-layout: fixed;
  width: 800px;
  margin: 0 auto;
  max-width:100%;/*for the demo snippet */
  max-height:100%;/* maybe you still want to see the content if textarea is too big ? */
  overflow:auto;
}
.textArea {
  display: flex;
  flex-direction: column;
  flex: 1;
  background: #F9F9F9;
  padding: 10px 10px 5px 10px;
  margin: 10px;
}
textarea {
height:100%;/* optionnal */
} 

.content {
  margin: 10px;
  min-height:100px;
  display:flex;
  flex-direction:column;
}
.content div {
  flex:1;
  overflow: auto;
  display: block;
  background: #ADE6DF;
  margin: 10px;
}
.content p {
  background: white;
  margin: 10px;
  padding: 5px;
}