Responsive QR Code

Community feedback

• 

  Rebecca Padgett•2,100

  @bccpadge

  Posted 7 months ago

  Hi @hkaur108. Congratulations on completing this challenge!!!🎉

  You are on the right track and need to focus on using semantic HTML tags.

  HTML 📃:

  • Every website must have at least one landmark like a <main> tag.
  • Wrap your content using the <main> tag and attribution info in a <footer> tag.
  • Alt Text for Images: Always include descriptive alt text for images. This ensures that screen readers and other assistive technologies can understand what the image represents, making your content more accessible.

  Example:

   <img src="./images/image-qr-code.png" alt="Scan the qr code to visit frontendmentor.io website">
  

  CSS 🎨:

  • Media query does not need to be used in this simple project.
  • Look at the styleguide.md file that give in the starter files provided from Frontend Mentor with the correct font-family.
  • Best practice to only apply CSS styles that are needed.
  • Max-width:100% and display:block; are great reset for images in CSS.

  Text-algin: auto; is a invalid CSS property. When building these projects be sure to use Developer Tools.

  .text-container {
    width: 100%;
    text-align: auto;
  }
  .text-container {
    width: 100%;
    text-align: auto;
  }
  

  Here is my solution to this challenge: QR Code component

  I hope you find these tips useful! Don’t hesitate to reach out if you have any questions or need further guidance. Keep up the amazing work!

  00

  Marked as helpful