@ratan17
Posted
I see that you've used flexbox to center the card container which is a right approach.
Your flexbox is only horizontally centered but not vertically.
That's because you have to set height to the flex container which is your
body element and then use another flexbox property align-items: center.
This will center your card container both horizontally and vertically.
It would look like this:
body{
min-height: 100vh;
display: flex;
justify-content: center;
align-items: center;
}
use min-height instead of just height.
If you want to get a good grip on flexbox I would suggest you to play this game: Flexbox Zombies Game
Marked as helpful
@annab6
Posted
@ratan17 Thank you sooo much for a hint about container height. I´ve updated my code already, took out margins and the card is perfectly centered! I Will check the zombies game, thanks for the tip!
