Design comparison
Solution retrospective
any recommendations for centering anything smack middle of the page?
Community feedback
- @ferlagherPosted over 2 years ago
Hi! The poition: absolute in the .container class is breaking the card when the screen is resized. For centering stuff in the middle of the page you first need to set the height of the body. Using height: 100vh works for me. Then you can use auto margins, flexbox or grid for center the content. I hope this was helpful, this is my first feedback! 😊 Sorry for my bad english.
Marked as helpful1 - @joecobbPosted over 2 years ago
Hello Alfiekadalfie, Hope you are good. You need to apply the following css to your parent div.
<div class="flex-container"> <div id="the-content"> </div> </div>.flex-container{ display: flex; height: 100vh; justify-content: center; align-items: center; }
Marked as helpful0
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