QR card

Community feedback

• 

  Melvin Aguilar 🧑🏻‍💻•61,140

  @MelvinAguilarPosted almost 2 years ago

  Hello there 👋. Good job on completing the challenge !

  I have some suggestions about your code that might interest you.

  Styles

  • Update the path of the styles to:

    <link rel="stylesheet" href="./css/main.css">
    

  • To display the image correctly, you should add a dot in its src attribute:

    <img src="./img/image-qr-code.png" ...>
    

    More information.

  HTML 📄:

  • Use the <main> tag to wrap all the main content of the page instead of the <div> tag. With this semantic element you can improve the accessibility of your page.

  • The text Improve Your Front-End Skills by Building Projects is considered a heading element.

  • Since this component involves scanning the QR code, the image is not a decoration, so it must have an alt attribute. The alt attribute should explain its purpose. e.g. QR code to frontendmentor.io

  CSS 🎨:

  • Setting the font-size to 62.5% can attract compatibility issues with third-party libraries or plugins. You can read more about this with this two lectures:

  1. The Surprising Truth About Pixels and Accessibility - The 62.5% trick
  2. A comment on the 62.5% trick

  Credit to grace-snow and vanzasetia for pointing this out.

  I hope you find it useful! 😄 Above all, the solution you submitted is great!

  Happy coding!

  Marked as helpful

  1

  ---

  

  ClaudioAmareno•230

  @ClaudioAmarenoPosted almost 2 years ago

  @MelvinAguilar Thanks for all, I made changes, but still I don't see a picture on my live web on github. *Edit nvm all works now thank you once again! :D

  1