JSFiddle - React, Tailwind, and code Playground
HTML
<div class="div-1">
<div class="div-2">
<div class="div-3">
<button>
Just a button
</button>
</div>
</div>
</div>
CSS
* {
margin: 0;
padding: 0;
}
html, body {
width: 100%;
height: 100%;
}
.div-1 {
position: relative;
height: 100%;
width: 100%;
}
.div-2, .div-3{
width: inherit;
height: inherit;
}
button {
position: absolute;
bottom: 10px;
left: 50%;
transform: translateX(-50%);
}