QR code component using flexbox

Community feedback

• 

  Hassia Issah•50,650

  @HassiaiPosted almost 2 years ago

  replace <div class="container"> with the main tag, to fix the accessibility issues. for more on semantic html visit https://web.dev/learn/html/semantic-html/

  Increase the padding value of .card and give .card_text a padding value for all the sides instead of giving .card_text h1 a padding value and .card_text p a padding-bottom value. For the distance between h1 and p either give h1 a margin-bottom value or p a margin-top value.

  Use rem or em as unit for the padding , margin, width and preferably rem for the font-size for more on this watch this https://youtu.be/N5wpD9Ov_To

  Hope am helpful HAPPY CODING

  Marked as helpful

  1

  ---

  

  Mateus Barbosa•20

  @mteusbarbosaPosted almost 2 years ago

  @Hassiai Thank you so much for the feedback, i'll look to implement yours suggestions and study more about those units, thank you for sharing a video about it.

  0
• 

  Favour•2,160

  @Nadine-GreenPosted almost 2 years ago

  HEY MATEUS!

  Congratulations on completing your first challenge

  I love your solution but I believe that it can be improved, I would like to share some ideas with you:

  • You will need to set a max-width for both the h1 and p elements so that they don't constantly expand.
  • To fix the error on your report, you will need to use a main for the .container instead of a div.

  HOPE I COULD BE OF HELP :)

  HAPPY CODING!

  Marked as helpful

  1

  ---

  

  Mateus Barbosa•20

  @mteusbarbosaPosted almost 2 years ago

  @Nadine-Green Thank you so much for the feedback, i'll look to study more about accessibility.

  0

  

  Favour•2,160

  @Nadine-GreenPosted almost 2 years ago

  @mteusbarbosa

  Glad that I could be of help :)

  0