QR code component

Community feedback

• 

  Hassia Issah•50,650

  @HassiaiPosted over 1 year ago

  wrap <div class="attribution"> in the footer tag to fix the accessibility issue.

  To center the section on the page using flexbox, replace the height in the main with min-height: 100vh.

  For a responsive content, replace the width in the section and img with max-width.

  Give h1 and p the same font-size of 15px which is 0.9375rem, text-align: center, the same margin-left, margin-right and margin-top values. Give p a margin bottom value.

  Use relative units like rem or em as unit for the padding, margin, width values and preferably rem for the font-size values, instead of using px which is an absolute unit. For more on CSS units Click here

  Hope am helpful.

  Well done for completing this challenge. HAPPY CODING

  Marked as helpful

  1

  ---

  

  Mariam Saeed•30

  @Mariam-SaeedPosted over 1 year ago

  @Hassiai Thanks a lot. I will follow this guide !😊

  0
• 

  Akhil-Nagpal•180

  @Akhil-NagpalPosted over 1 year ago

  Hello Mariam! Congratulations on completing your first project! 🎊

  To fix the accessibility error, you need to change this thing in your code:

  • Just nest the attribution group element inside the <main> tag. This will fix the landmark error.

  Other Suggestions:

  • In CSS always try to use relative units like em or rem instead of absolute units like px. Using these relative units will improve the responsiveness. Read this for a better understanding 👉 Should we use Rem, Em, or Pixel?
  • There's a slight drop shadow under the card. Try to add a box shadow to the card. This will bring your solution near to perfect.

  Otherwise! You did an amazing job! Well Done! 👌

  I hope this will help you to improve! 😄

  Happy Coding!

  Marked as helpful

  1

  ---

  

  Mariam Saeed•30

  @Mariam-SaeedPosted over 1 year ago

  @Akhil-Nagpal Thanks a lot! I will improve those things 😊

  0
• 

  Temsaah•450

  @TemsaahPosted over 1 year ago

  To fix the accessibility issue you should replace the "<div class="attribution">" with footer tag someone told me about that before i am just a beginner. and the design looks almost identical well done !

  Marked as helpful

  1

  ---

  

  Mariam Saeed•30

  @Mariam-SaeedPosted over 1 year ago

  @Temsaah I will. Thanks a lot !

  0
• 

  Ric•210

  @Ripra87Posted over 1 year ago

  It looks really good ) nothing to say, happy coding! ))

  1

  ---

  

  Mariam Saeed•30

  @Mariam-SaeedPosted over 1 year ago

  @Ripra87 Thanks a lot!😊

  0