JSFiddle - React, Tailwind, and code Playground

by John Hutchins

HTML

<div class="grid-row">
      <div class="grid-column-half">
        <div class="tinted-container">
          <p>Taller</p>
          <p>column</p>
          <p>on</p>
          <p>left</p>
        </div>
      </div>

      <div class="grid-column-half">
        <div class="tinted-container">
          <p>This container should be the same height as the other one.</p>
        </div>
      </div>
    </div>

CSS

.tinted-container {
  height: 200px;
  border: 1px solid black;
}

.grid-column-half {
  float: left;
  display: inline-block;
}