JSFiddle - React, Tailwind, and code Playground

by 규연 황

HTML

<div class="grid">
  <span>0</span>
  <span>0</span>
  <span>0</span>
  <span>0</span>
  <span>0</span>
  <span>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quidem ipsum ipsa voluptatum perspiciatis possimus repellat quia nisi ut quos. Libero!</span>
  <span>0</span>
  <span>0</span>
  <span>0</span>
  <span>0</span>
  <span>0</span>
  <span>0</span>
  <span>0</span>
  <span>0</span>
  <span>0</span>
</div>

SCSS

.grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: minmax(50px, auto);
  gap: 20px;
  span {
    border: 1px solid red;
  }
}