QR Code - My First Frontend Mentor Project with HTML and CSS

Community feedback

• 

  Milton Sánchez•90

  @sanchezmiltonPosted over 2 years ago

  I like it! I didn't take into account doing HTML semantic markup, I'll fix it later.

  Regarding the position of the footer, if you added the display: flex tag to the body you can add the align-self: flex-start rule to the footer, that should be enough. I hope it helps!

  Marked as helpful

  1
• 

  Macaulay Omoikhoje De-great•550

  @MacChristoPosted over 2 years ago

  Try and wrap your main contents inside a <main> tag. Since there are only two object on the body, the container and the attribution, you can have something like this:

  body:{
      display: flex;
      flex-direction: column;
      align-items: center;   *This will center the objects after using flex*
      justify-content: space-between;      *Add these to the body*
      overflow: hidden;
      height: 100vh;
  }
  

  Remove all styles from your attribution

    <footer>
  
      <div class="attribution">
        Challenge by <a href="https://www.frontendmentor.io?ref=challenge" target="_blank">Frontend Mentor</a>.
        Coded by Mabs.
      </div>
    </footer>
  

  Your attribution should be in footer tag. And no need to wrap the attribution element in a paragraph tag. All styles they need should be applied to the .attribution class. The follow-come styles for the attribution are even enough. just need to reduce the font-size. Hope this helps.

  Marked as helpful

  1
• 

  mubizzy•1,520

  @mubizzyPosted over 2 years ago

  Excellent job on this challenge! your report has a few issues though:

  1. wrap everything in your body in <main> or use semantics

  2.   it is a best practice to use both HTML 5 and ARIA landmarks to ensure all     content is contained within a navigational region.

  Hope it helps:)...don't forget to mark it as helpful 👍

  You can get more details here...click here

  Marked as helpful

  1