JSFiddle - React, Tailwind, and code Playground

by LuckyCat

HTML

<div class="container-wrapper">
  <div class="container-wrapper-item">
    
  </div>
  <div class="container-wrapper-item">
    
  </div>
  <div class="container-wrapper-item">
    
  </div>
  <div class="container-wrapper-item">
    
  </div>
  <div class="container-wrapper-item">
    
  </div>
  <div class="container-wrapper-item">
    
  </div>
</div>

CSS

.container-wrapper{
display: grid;
grid-template-columns: auto auto auto;
grid-gap: 10px;
background-color:#333333;
padding:10px;
}


.container-wrapper-item{
background-color: #333333;
border:1px solid red;
padding:20px;
color:white;

}
.container-wrapper-item:before{
    content: "";
    display: block;
    padding-top: 100%;
}