JSFiddle - React, Tailwind, and code Playground

by Shang WenLong

HTML

<div id="one"><div id="two" /></div>

CSS

#one {
    width: 600px;
    height: 300px;
    background: red;
    position: relative;
}

#two {
    width: 300px;
    height: 150px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -75px; /* negative half of height */
    margin-left: -150px; /* negative half of width */
    background: blue;
}