JSFiddle - React, Tailwind, and code Playground

HTML

<div class="list">
<div class="parent">
      <div class="head"></div>
      <div class="content">
            <img src="http://via.placeholder.com/100x100">
            <p>some text</p>
      </div>
</div>
<div class="parent">
      <div class="head"></div>
      <div class="content">
            <img src="http://via.placeholder.com/150x100">
            <p>some text 2</p>
      </div>
</div>
<div class="parent">
      <div class="head"></div>
      <div class="content">
            <img src="http://via.placeholder.com/100x150">
            <p>some text 3</p>
      </div>
</div>
</div>

CSS

.parent {
  margin: 5px;
  padding: 5px;
  border: 1px solid;
  width: calc(33% - 24px);
  display: inline-block;
  vertical-align: top;
  text-align: center;
}