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

@Elwyn17

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


What are you most proud of, and what would you do differently next time?

It was effortless to implement.

What challenges did you encounter, and how did you overcome them?

To have the correct measurements was a challenge by looking up in Figma.

I improvised based on my instinct and it helped.

What specific areas of your project would you like help with?

This was easy.

Community feedback

P

@developer-ruben

Posted

Hi!

Welcome to the community! Here are my tips:

  • Why did you use the <main> tag as the container for your component? This way you cannot implement it in other pages (since you can only have one main tag on a page). Try 'section' or 'article' instead, since this is an independent component
  • Try keeping HTML and CSS code separate, even though it's a small component
  • Search for the BEM methodology to better organise your code
  • It's good to add the width and height in the HTML to prevent the page from scaling while loading the image
0
SrkiMax 50

@SrkiMax

Posted

I am just started coding myself, and I learn a lot by just looking at other people's code to see how they implemented the solution. I liked the way you positioned text(content) using this snippet in css: .content { padding: 4px 16px; }

Keep up the good work

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