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

Responsive CSS HTML Qrcode

@Eucalyptus2

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 did a walkthrough code along and had trouble linking my second time qr code without help. The second time around I was able to mimic somethings so im most proud of that. Next time I will do it without help and just simply submit lmao

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

All feedback is welcomed and appreciated!

Community feedback

P

@vstm

Posted

Nicely done, congratulations on finishing your first challenge :D

I think your HTML looks really clean, I also like the comments in your CSS (comments are something I should use more often).

Here are some things I think you could improve:

  • I think the line <link rel="stylesheet" href="Outfit.zip"> can be removed, since stylesheets should be CSS files directly, the browser doesn't know what to do with a ZIP in this context
  • The line <link href='https://fonts.googleapis.com/css?family=Outfit' rel='stylesheet'> can be moved inside the <head> tag. The browser handles it correctly but if you check out the DOM in the inspector that is because the browser moves it automatically inside the <head> tag.
  • <img id="qr" ... -> I would change that id attribute to class and use a class selector in your css (#qr -> .qr). This way your "way of styling" is consistent (all the other elements you also style with class selectors). Also depending on who you ask ID selectors are discouraged because they are not reusable. For example and you can only style one element per page with it, because only one element can have id="qr".

I hope my comment helps you, if you have any questions regarding my feedback don't hesitate to ask me :D

0

@Eucalyptus2

Posted

@vstm Thank you so much! I will apply :)

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