Design comparison
Solution retrospective
I am proud of myself for being able to do this project with very minimal help. I've been struggling with CSS for a while now. I have a hard time figuring out what needs to where. But I'm slowly learning and am hoping to get the hang of it. Next time, I'll probably add more styles and use CSS frameworks once I learn them. I'll also use better media queries for all sorts of devices.
What challenges did you encounter, and how did you overcome them?I faced a challenge while getting the QR container to the shape given in the design. I had to experiment with the margin and padding values, but after a while i figured it out! I also faced a little difficulty with media queries. I'm still not perfect at it but overtime, I'll be acing it.
What specific areas of your project would you like help with?I would like help with the media queries. That for me is the most difficult topic in CSS. Not in the way I don't understand it, but I have a difficult time figuring out what values to put for which properties to make the website responsive.
Community feedback
- @Alex-Archer-IPosted 6 months ago
Hi! Good work! You even created your own footer - that's cool =)
The simplest way to figure out where your site need a media breakpoint - to open the dev toolbar, switch it to mobile devices version and just drag the border until your work become broken or ugly. And than write rules for these values.
I recommend you to use percentage for width on the small screens. Something like this: width: 90%; max-width: 375px; This way you'll have a box that stretched on small screens and has a constant size on the large ones.
You can use this approach with the img as well, but don't specify the height value.
By the way, you have decent css rules organization =)
Good luck!
Marked as helpful1@Aishi-JainPosted 6 months agoThank you very much for the detailed review! I'll definitely apply what you said for the media queries in my next project :) @Alex-Archer-I
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