How Can I Vertically Center a DIV Element in the Body of HTML?
Learn how to vertically center a DIV element in the body of HTML using CSS techniques like Flexbox, Grid, and position properties. Simple examples included.
Sign in to track your courses, save progress, and apply for internships. Sign in or create an account.
1 Answer
To vertically center a `div` in the body of HTML, you can use either Flexbox or CSS Grid:
*Flexbox:*
css
body {
display: flex;
align-items: center;
justify-content: center;
height: 100vh;
margin: 0;
}
*CSS Grid:*
css
body {
display: grid;
place-items: center;
height: 100vh;
margin: 0;
}
