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 code component solution: Vanilla HTML, CSS

Benevolent 490

@bene-volent

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


  • Any recommendation would be appreciated.
  • Thank you for your time🙂

Community feedback

David 8,000

@DavidMorgade

Posted

Hey Benevolent, welcome to the community and congrats on finishing the challenge!

You did a pretty good job and got it almost pixel perfect on your first challenge, good job on that!

As general fixes, try to don't manipulate the font-size on the :root, and if you do for any type of reason, is better to just do it on the body, because people with visuals problems will be a harder type adapting their screen if the default font-size is changed on the root!

And also would recommend you to always use relative units like rems and ems instead of pixels for your sizes, paddings and margins!

Apart from that, the rest is perfect in my opinion, jump on a harder challenge!

Hope my feedback helped you!

Marked as helpful

2

Benevolent 490

@bene-volent

Posted

@DavidMorgade thank you

1
Lucas 👾 104,420

@correlucas

Posted

Hey Benevolent, congratulations for you solution!

You've a really clean solution and great code. Two things you change to keep your code even more minimal is manage the CSS without using classes by selecting the h2 with his direct selector in the css sheet and give the bold styling without those 2 classes, I'm saying that because your code is already clean, doing that you make even more lightweight the css and html files.

Great solution by the way and great start, looking forward for your next solutions.

Hope this helps, happy coding 👏

Marked as helpful

1
Baliram 260

@0ME9A

Posted

Hey Benevolent, congratulations on your solution!

Nice job...

#happyCoding🧑‍💻

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