QR code component

Community feedback

• 

  Kamlesh Rajesh Yadav•5,060

  @Kamlesh0007Posted over 1 year ago

  Congratulations on completing the challenge! That's a great achievement, and I'm sure you put a lot of effort into it. I really liked the way you approached the challenge and the code you wrote. You demonstrated a good understanding of the concepts and applied them effectively to solve the problem.I have a few suggestions to improve your code further. You need to add an alt attribute to the img tag because it provides a text alternative for the image, which is useful in Users with visual impairments rely on screen readers to access the content on web pages. The alt text helps the screen reader software to describe the content of the image, which makes the page more accessible. add below Lines of code to add alt text in image tag

  <img src="images/image-qr-code.png" alt="qr-code-image" />
  

  You can use Flexbox to center elements. Compared to using positioning, flexbox provides the following benefits:

  1.It requires less code and is easier to understand and implement.

  2.It automatically adjusts centering as the container size changes, making it ideal for responsive designs.

  3.It has a property specifically for vertically aligning items, eliminating the need for complex calculations.

  4.It handles dynamic content, such as varying text lengths, without requiring manual adjustments. so u can add below code to make container center using flexbox

  body {
  min-height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  
  }
  now remove below styles
  .wrapper {
  position: relative;
  top: 90px;
  left: 550px;
  }
  

  Marked as helpful

  0