Design comparison
Solution retrospective
Hello! I want to be able to center vertically the container of the card, but I wasn't able to do it. Can someone explain me how to do it?
Community feedback
- @saniyasaher20Posted about 3 years ago
body{ display: flex; align-items: center; height: 100vh; }
Add these three lines to your body tag to vertically align the .container
Explanation: In your code, body is parent tag of the card( .container ) and card is child. To align the child you can add 'display: flex;' to your parent tag and then use other flex properties to align the child either vertically or horizontally. the next line align-items: center; will align the child means card to center. But make sure you parent have space to give to the child that's why third line comes handy. Add height: 100vh; to body.
Marked as helpful0@elvladi15Posted about 3 years ago@saniyasaher20 oh, thank you very much for the feedback!
0
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord