JSFiddle - React, Tailwind, and code Playground

HTML

<div id="rel">
    <span id="abs">Why I'm not centered ?</span>
</div>

CSS

#rel {
    position: relative;
    top: 10px;
    left: 20px;
    width: 400px;
    height: 300px;
    border: 1px solid red;
    text-align: center;
}

#abs {
    position: absolute;
    bottom: 15px;
    width: 300px;
    height: 200px;
    border: 1px solid blue;
}