Design comparison
Community feedback
- @AdrianoEscarabotePosted 28 days ago
Hello PREETHAM-HT, how are you? I was really pleased with your project, but I’d like to offer some advice that might help:
Using Flexbox or Grid on the
body
to center elements ensures a more responsive and adaptive layout, fitting different screen sizes seamlessly. It avoids manual calculations and constant adjustments needed withmargin
,padding
, or absolute positioning. These techniques provide more consistent alignment and simplify the code.flexbox:
body { display: flex; justify-content: center; align-items: center; min-height: 100vh; }
grid:
body { display: grid; place-content: center; min-height: 100vh; }
The rest is spot on.
Hope it’s helpful to you. 👍
Marked as helpful0 - @DannimationsPosted 29 days ago
Good job, just put the main div at the center of the page. You can achieve this by making it's position relative, then use the top, left and right attributes to position it accordingly.
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