Responsive layout using CSS Grid and Media Queries
Design comparison
Solution retrospective
I am proud I could finish one of the hardest challenges I made so far, Next time I will make Layouts using grid faster and without getting confused with grid elements.
What challenges did you encounter, and how did you overcome them?challenges are:
- Confusion what should be with grid and what should be with flex.
- what are the proper values to set the grid templates.
- how should I distribute the the grid and how should I manage it child elements.
- How should I switch the layouts with grid in mobile screens using the media queries.
- My main headers disappeared after shrinking the screen.
I overcome most of these questions thanks to moderators in the Discord community
What specific areas of your project would you like help with?I think I still need to practice a lot for a better understanding of the CSS grid layouts
Community feedback
- @BillRozyPosted 6 months ago
It looks nice, but i think you used wrong breakpoint for desktop, it should start with 1440px, but in your example i see it starts from 1024 or something like this. Also, try to be more accurate with paddings, they differ a lot comparing with design. Good joB!
1@MajdMohammedPosted 6 months ago@BillRozy Thanks for the feedback, I appreciate it!
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