QR code component

Community feedback

• 

  Adriano•38,270

  @AdrianoEscarabotePosted almost 2 years ago

  Hello Dhanya, how are you? I truly loved your project's outcome, however I have some advice that I hope you'll find useful:

  To align some content in the center of the screen, always prefer to use display: flex; it will make the layout more responsive!

  body {
      margin: 0;
      padding: 0;
      display: flex;
      align-items: center;
      flex-direction: column;
      justify-content: center;
      min-height: 100vh;
  }
  

  I noticed that you made your entire code using divs! this is not a good practice since div has no meaning, to improve the structure of your code we can use semantic elements that have meanings, not only for us who are developers, but also for screen readers, that is, a person who uses tools to browse the web, can better understand the content if our code is well written with semantic tags and some other features to improve accessibility!

  The remainder is excellent.

  I hope it's useful. 👍

  Marked as helpful

  1
• 

  Aditya Singh•460

  @adityas24Posted almost 2 years ago

  Hi Dhanya, Great work by you. I found following irregularities in your HTML

  1. Instead of writing this <div class="header"> Improve your front-end skills by building projects </div> You could have written

       <h2> Improve your front-end skills by building projects </h2>
  

  It is semantically better code. And not necessary to use h2 tag. You can use any heading tag according to requirement

  2. And you should have used paragraph tag here

       <div class="text-copy">
            Scan the QR code to visit Frontend Mentor and take your coding skills to 
             the next level
        </div
  

  Instead of above code, you should write <p> Scan the QR code to visit Frontend Mentor and take your coding skills to the next level </p>

  Here right tag to be used is paragraph tag.

  Thanks, Happy coding.

  Marked as helpful

  1