JSFiddle - React, Tailwind, and code Playground

HTML

<div class="grand">
    <div class="parent">
        <div class="child"></div>
    </div>
</div>

CSS

.grand {
    text-align: center;
    width: 100%;
    position: relative;
}
.parent {
    width: 50%;
    height: 200px;
    margin: 0 auto;
    background: red;
}
.child {
    position: absolute;
    left: 0;
    width: 100%;
    height: 100px;
    background: black;
}