Sometimes, we want to make a div always full screen with CSS.
In this article, we’ll look at how to make a div always full screen with CSS.
How to make a div always full screen with CSS?
To make a div always full screen with CSS, we use flexbox.
For instance, we write
body {
display: flex;
height: 100vh;
margin: 0;
}
div {
flex: 1;
background: tan;
}
to make the body element a flex container with display: flex;.
Then we make the divs inside the body element fit the remaining width of the screen with flex: 1;.
Conclusion
To make a div always full screen with CSS, we use flexbox.
