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 generator

@dekzyd

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?

I am proud I was able to complete and submit this project. It took a lot to submit but I scaled through. Next time I would look for tutorials as faster methods to solving problems

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

I had problems hosting the live project. I was able to solve this problem by not giving up and finding a solution on Youtube.

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

Font styling.

Community feedback

Luca 130

@LucaJahnen

Posted

Hello there,

Your submission looks really good however I would implement some minor changes:

styles

Consider adding a reset, e. g.

`* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}`

This removes default padding from elements like headings and allows you to anticipate how these elements are going to behave.

semantic html

Please use an <h1> element for your heading. Overall there are six headings from <h1> to <h6>. <h1> being most important and <h6> least important.

font

If you use an <h1> element for your heading you'll notice the font-size and font-weight will increase. Manually adjust the font-size and your submission will be even closer to the Design.

If you want to learn more about fonts consider checking out this website: Fonts | MDN.

units

Consider using relative units like vw or percentages for widths and heights so your submission will be responsive. However using px or rem for border-radius or font-size is okay

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