QR Code Component by Alfraz Ahmed

Community feedback

• 

  Marcos Travaglini•4,840

  @BlackpachamamePosted 11 months ago

  Good job!

  Here are some comments that may help you:

  • Use min-height: 100vh instead of height; 100vh (with this you are restricting a specific height, it can generate unexpected results)
  • Use semantic tags such as main, footer, figure, etc, this helps the accessibility and SEO of the site
  • The <div class="qr-code-container"> should be <main class="qr-code-container">
  • The <div class="attribution"> should be <footer class="attribution">
  • You don't need a margin: auto 0; in your .qr-code-container class, to separate the main from the footer, you can simply place a gap: 20px in the body

  Marked as helpful

  0

  ---

  

  Alfrazgit•50

  @AlfrazgitPosted 11 months ago

  @Blackpachamame Thank you for your kind words and support. I will keep these things in mind. Is it always better to use min-height or min-width when trying to limit the size of things?

  0
• 

  P

  Daniel Zeljko•50

  @danielzeljkoPosted 11 months ago

  I also have trouble with CSS naming and one of the methodologies I found helpful was BEM. I tried to use this in my most recent solution. I think both height and width for the image was supposed to be 288px.

  Great use of root and props for resetting the browser defaults as well!

  0