QR code component

Community feedback

• 

  

  Gwenaël Magnenat•1,540

  @gmagnenat

  Posted 4 months ago

  Hi,

  here are a few things I noticed.

  • Alt Text: The alt text should be more descriptive. Instead of something vague, use "QR Code to frontendmentor.io." This tells users what the image is and where it leads.
  • Simplifying HTML: The image doesn’t need to be wrapped in a <div>. Removing unnecessary containers makes the code cleaner and easier to style.
  • Viewport Height Issues: Instead of height: 100vh, use min-height: 100vh. When zooming in at 200%, content expands, and a fixed height can cause it to be cut off at the top and bottom. Using min-height allows the content to grow without being constrained.
  • Image Width: There’s no need to set a specific width on the image since it is inside the card. Instead, allow it to take up 100% of the card’s width and control spacing by adding padding to the card itself.

  I hope you find something useful here to refactor your code.

  Have fun !

  01

  Marked as helpful
• 

  StanleyIfeanyi4•10

  @StanleyIfeanyi4

  Posted 4 months ago

  nice

  00