JSFiddle - React, Tailwind, and code Playground

by Renan Ribeiro Brando

HTML

<div class="card">
  <div class="item">
    <div>
      1
    </div>
  </div>
  <div class="item">
    <div>
      2
    </div>
  </div>
  <div class="item">
    <div>
      3
    </div>
  </div>
  <div class="item">
    <div>
      4
    </div>
  </div>
  <div class="item">
    <div>
      5
    </div>
  </div>
</div>

CSS

.card {
  column-count: 4;
}

.item {
  display:block;
  -webkit-column-break-inside: avoid;
  break-inside:avoid;
  box-shadow: 18px 14px 65px -9px rgba(0,0,0,0.51);
  border-radius: 8px;
  min-height: 200px;
  margin: 8px;
  padding: 16px;
}