Sometimes, we want to center an absolutely positioned element in a div with CSS.
In this article, we’ll look at how to center an absolutely positioned element in a div with CSS.
How to center an absolutely positioned element in a div with CSS?
To center an absolutely positioned element in a div with CSS, we use flexbox.
For instance, we write
div {
display: flex;
align-items: center;
justify-content: center;
}
to make the div a flex container with display: flex;.
We vertically center its content with align-items: center;.
And we horizontally center its content with justify-content: center;.
Conclusion
To center an absolutely positioned element in a div with CSS, we use flexbox.
