😌Centering a Div in Tailwind CSS

We Need Knowledge of this :

• use h-screen to make the element the height of the screen.

• use flex to make the element a flexbox

• use items-center to vertically center it

• use justify-center to center it horizontally.

Horizontally and vertically center an element with Tailwind

<div class="h-screen flex items-center justify-center">
    Horizontally and Vertically Centered Element
</div>

Vertically centering an element with Tailwind

<div class="h-screen flex items-center">
    Vertically Centered Element
</div>

Horizontally centering an element with Tailwind

<div class="flex justify-center items-center">
    Horizontally Centered Element
</div>