QR Code Landing Page using CSS

Community feedback

• 

  Abdul Khaliq 🚀•72,560

  @0xabdulkhaliqPosted 8 months ago

  Hello there 👋. Congratulations on successfully completing the challenge! 🎉

  • I have a suggestion regarding your code that I believe will be of great interest to you.

  ---

  BAD WAY OF ADDING QR iMAGE 📸:

  • Since this component involves scanning the QR code, the image is not a decoration, so it must want to added via <img> element and not using a div element's background image.

  ---

  • So replace the div element with an img element which has source of /images/image-qr-code.png and alt of QR code to frontendmentor.io

  ---

  Example:

  <img src="/images/image-qr-code.png" alt="QR code to frontendmentor.io">
  

  ---

  Now remove the rules you've written for .qr-code-square,

  .qr-code-square {
    border-radius: 8px;
    width: 288px;
    height: 288px;
    background-image: url("images/image-qr-code.png");
    background-size: 288px;
  }
  

  Instead you can add this,

  img {
    border-radius: 8px;
    width: 288px;
    height: 288px;
  }
  

  ---

  .

  I hope you find this helpful 😄 Above all, the solution you submitted is great !

  Happy coding!

  0
• 

  Bhuvan•40

  @bhuvandev16Posted 8 months ago

  I think you have forgot to add the paragraph color

  0