QR code component

Community feedback

• 

  Hassia Issah•50,650

  @HassiaiPosted almost 2 years ago

  Replace<div class="card"> with main tag and <h3> with <h1> to fix the accessibility issue. click here for more on web-accessibility

  Reduce the padding value for .card and font-size .text

  Use rem or em as unit for the padding, margin, width and preferably rem for the font-size for more on CSS units. click here

  Hope am helpful.

  Well done for completing this challenge. HAPPY CODING

  Marked as helpful

  0
• 

  Osama Elshimy•140

  @Osama-ElshimyPosted almost 2 years ago

  Great work and very clean code!

  Here are some points you can improve:

  • Every image should have an alt attribute. This is essential for screenreaders. You can set the alt attribute like this:

  a="A QR code to FrontendMentor website"
  

  • You should replace the div element with the .card class with a main element instead. div elements are generic elements. They don't have a semantic meaning and you should put your main content inside of a main element.

  • The div elements with the classes of (text, details) are not necessary, you can remove them and add the text class to the h3 element and the details class to the p element

  I hope you you find this helpful

  Happy Coding!

  Marked as helpful

  0

  ---

  

  バレンタイン 😈•64,190

  @VCaramesPosted almost 2 years ago

  Welcome to FEM @Osama-Elshimy

  As a friendly reminder, please avoid the following as it is against FEM’s policy:

  • "If you find this comment helpful, click the Mark as helpful button.”

  Which can result in your getting your account flagged and banned temporarily/permanently.

  "Ask people to mark your comment as helpful — A big part of Frontend Mentor is helping each other out and providing feedback. If you give some feedback, please avoid saying things like, "if you found this feedback useful, please mark this comment as helpful". It places unnecessary pressure on the solution author to mark your comment as helpful, which is best avoided. Feel free to say something like, "I hope you find this helpful", but please avoid asking for your comment to be marked as helpful outright."

  The goal of providing feedback is to help individuals learn and grow as developers; not about gaining points.

  Thank you for contributing to the FEM community!

  Happy Coding! 🎆🎊🪅

  0

  

  Osama Elshimy•140

  @Osama-ElshimyPosted almost 2 years ago

  @vcarames Thanks a lot

  0