Sometimes, we want to align the entire HTML body to the center with CSS.
In this article, we’ll look at how to align the entire HTML body to the center with CSS.
How to align the entire HTML body to the center with CSS?
To align the entire HTML body to the center with CSS, we use flexbox.
For instance, we write
body {
display: flex;
flex-direction: column;
justify-content: center;
min-height: 100vh;
}
to make the body element a flex container with display: flex;
.
Then we make its flex direction vertical with flex-direction: column;
.
Then we center its contents vertically with justify-content: center;
Conclusion
To align the entire HTML body to the center with CSS, we use flexbox.