QR Code Component Main

Community feedback

• 

  cisneConCorbata•170

  @cisneConCorbataPosted over 1 year ago

  Hi! This is really good, you just need to fix the accessibility issues using landmarks like <main>, <footer>, etc.

  This would be the main content:

  <main>
  <div class="square">
      <div class="qr">
        <img src="./images/image-qr-code.png" alt="qrcode" width="375px">
      </div>
      <div class="title">Improve your front-end skills by building projects</div>
      <div class="sub-text">Scan the QR code to visit Frontend Mentor and take your coding skills to the next level</div>
    </div>
  </main>
  

  This would be your attribution:

  <footer>
  <div class="attribution">
      Challenge by <a href="https://www.frontendmentor.io?ref=challenge" target="_blank">Frontend Mentor</a>. 
      Coded by <a href="https://github.com/Melchor16/IntroQr">Erick Villarreal</a>.
    </div>
  </footer>
  

  As for the vertical alignment, you need to use flexbox

  main {
         min-height: 90vh;
         display: flex;
         justify-content: center;
         align-items: center;
     }
  

  Marked as helpful

  0

  ---

  

  Erick Melchor•220

  @Melchor16Posted over 1 year ago

  @cisneConCorbata Hi! Thanks, I'm taking note, this makes a lot of sence, gonna put this in practice on the next one.

  0
• 

  jordanBuilder•60

  @jordanBuilderPosted over 1 year ago

  hey Melchor16 i just starting the web development this is challenge is my first.Please can you just help me by breaking down how should i start ?

  0

  ---

  

  Erick Melchor•220

  @Melchor16Posted over 1 year ago

  @jordanBuilder Hi! I'm also a beginner, but you can see the comment above from @cisneConCorbata, his comment is really helpful and you can start there, if you got any question you can ask and I'm going to try to help.

  0