JSFiddle - React, Tailwind, and code Playground

by Lalji Tadhani

HTML

<div class='outer'><div class='inner'></div></div>

CSS

.outer{
position: realative;
top:20%;
left:20%;
width:500px;
height:500px;
background:red;
display:flex;
align-items:center;
justify-content:center;
}
.inner{
position:relative;
width:100px;
height:100px;
background:#ff2;
/*code to align in centre*/
}