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

More Responsive QR Code

@WhaleMentalist

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 modified the CSS with some really helpful suggestions and the challenge solution is A LOT better. Thanks!

Community feedback

@VCarames

Posted

Good job!

Some suggestions:

-Remove both display: flex and flex-direction: column from your qr-code class. By default, your content, is already vertically aligned.

-Change your max-width to 320px/ 20rem.

-Header font-size to 22px.

-Change paragraph font-size from 18px to 16px or just remove completely; by default, the pixel size in most browsers is 16px.

Keep up the good work.

Marked as helpful

1

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