@MikeBeloborodov
Posted
Hey! Good work on that solution. To answer your question: Let's say that you have a body and 1 div, to center this div inside the body you need to do this
body {
height: 100%;
display: flex;
justify-content: center;
align-items: center;
background-color: green;
}
div {
width: 100px;
height: 100px;
background-color: red;
}
If you do this and remove height on your body, then it won't center vertically, because body does not stretch to the full height without content. But if you add height - then it's a box that covers the full screen and your div will be in the center because justify-content centered it horizontaly and align items verticaly.I added some background color on body and div to see how it stretches. You don't have to add height and width 100 px to your div, I just did this for the showcase, you should have your own height and width on your div.
Marked as helpful