JSFiddle - React, Tailwind, and code Playground

HTML

<div id="todos">
    <div id="div1"/>  
    <div id="div2"/>  
    <div id="div3"/>  
    <div id="div4"/>  
</div>

CSS

#div1{width:50px;
      height:50px;
      background:red;
    
    }
#div2{width:50px;
      height:50px;
      background:blue;
     
    }
#div3{width:50px;
      height:50px;
      background:green;
    }
#div4{width:50px;
      height:50px;
      background:yellow;
    }
#todos{
    display:flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;   
}