Sometimes, we want to center text (horizontally and vertically) inside a div block with CSS.
In this article, we’ll look at how to center text (horizontally and vertically) inside a div block with CSS.
How to center text (horizontally and vertically) inside a div block with CSS?
To center text (horizontally and vertically) inside a div block with CSS, we use flexbox.
For instance, we write
#container {
display: flex;
justify-content: center;
align-items: center;
}
to make the element with ID container a flex container with display: flex;.
Then we center items horizontally with justify-content: center;.
We center items vertically with align-items: center;.
Conclusion
To center text (horizontally and vertically) inside a div block with CSS, we use flexbox.
