Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

QR Components Solution

Desktop design screenshot for the QR code component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


I had difficulties while I was trying to create the mobile version. I would appreciate an explanation of that.

Community feedback

Arkadiusz 200

@Arkadiusz-coder

Posted

Hi, you have a problem with mobile version, because it is harder to make mobile version when the desktop version is already done. Good practice for making layouts in CSS is to start your project with mobile version and change layout with @media query for bigger screens, not other way around. So your first @media should have this: "(min-width: 450px)", not this: "(max-width: 450px)".

Marked as helpful

0

@Blaben

Posted

@Arkadiusz-coder Thank you so much for your great feedback. It is rather unfortunate that I am now seeing this after I already started with my second challenge on Summary Result.

I would start working with the mobile version first right away when I start with my third challenge. Thank you once again for your help

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join 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