JSFiddle - React, Tailwind, and code Playground

by Hugo Vale Pereira

HTML

<div class="wrapper">
  <div class="box1">One</div>
  <div class="box2">Two</div>
  <div class="box3">Three</div>
  <div class="box4">Four</div>
  <div class="box1">One</div>
  <div class="box2">Two</div>
  <div class="box3">Three</div>
  <div class="box4">Four</div>
  <div class="box1">One</div>
  <div class="box2">Two</div>
  <div class="box3">Three</div>
  <div class="box4">Four</div>
  <div class="box1">One</div>
  <div class="box2">Two</div>
  <div class="box3">Three</div>
  <div class="box4">Four</div>
</div>

CSS

.wrapper {
  border: 4px solid orange;
  display: grid;
  grid-template-columns: [line-name1 line-name2] 100px
  
  
}

div{
  border-radius: 5px;
  border: 4px solid greenyellow;
}