JSFiddle - React, Tailwind, and code Playground

HTML

<div>
  <div class="flex-container">
    <div class="flex-col">
      <div class="box">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec tortor metus, ultrices ut egestas eget, lacinia ut tellus. Duis consectetur velit ut aliquam convallis. Donec erat ex, interdum et justo in, varius pharetra nunc. Integer rutrum, ante nec gravida scelerisque, urna massa convallis enim, et tincidunt leo odio eget nisl. Ut et blandit velit, ac tristique massa. Integer leo mi, tincidunt in bibendum eu, blandit eget est. Cras convallis elit id urna convallis euismod.</div>
    </div>
    <div class="flex-col">
      <div class="flex-container list-container">
        <div class="flex-col list">Content</div>
        <div class="flex-col list">Content</div>
      </div>
    </div>
  </div>
</div>

CSS

.box {
  background-color: blue;
}

.list-container {
  height: 100%;
}

.flex-col.list {
  background-color: lightblue;
}

.flex-container {
  display: flex;
  flex-direction: row;
  -webkit-flex-direction: row;
  flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  margin-left: -1em;
}

.flex-col {
  -webkit-flex: 1;
  flex: 1;
  margin-left: 1em;
}