JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<div class="row">
  <div class="col-3">
    <div style="height: 200px;" class="d-flex flex-column">
      <div class="bg-primary h-100" >

      </div>
      <div class="flex-grow-1">
        LOTS OF TEXT HERE
      </div>
    </div>
  </div>
  <div class="col-3">
    <div style="height: 200px;" class="d-flex flex-column">
      <div class="bg-primary h-100" >

      </div>
      <div class="flex-grow-1">
        LOTS OF TEXT HERE LOTS OF TEXT HERE LOTS OF TEXT HERE LOTS OF TEXT HERE LOTS OF TEXT HERE
      </div>
    </div>
  </div>
  <div class="col-3">
    <div style="height: 200px;" class="d-flex flex-column">
      <div class="bg-primary h-100" >
        <img src="https://images.theconversation.com/files/93616/original/image-20150902-6700-t2axrz.jpg?ixlib=rb-1.1.0&q=45&auto=format&w=1000&fit=clip" style="max-width: 100%; max-height: 100%;" />
      </div>
      <div class="flex-grow-1">
        LOTS OF TEXT HERE LOTS OF TEXT HERE LOTS OF TEXT HERE LOTS OF TEXT HERE LOTS OF TEXT HERE
      </div>
    </div>
  </div>
</div>