QR Code Task

Community feedback

• 

  Ecem Gokdogan•9,380

  @ecemgoPosted over 1 year ago

  Some recommendations regarding your code that could be of interest to you. 🤗

  HTML

  In order to fix the accessibility issues

  • Each main content needs an h1 element. Your accessibility report states page should contain a level-one heading. So, you need to use a <h1> element in the <main> tag instead of using the <h2> element. You can replace the <h2>Improve your front-end skills by building projects</h2> element with the <h1>Improve your front-end skills by building projects</h1> element.

  CSS

  • If you want to center it, you can add these flex features to your body

  body {
      flex-direction: column;
      align-items: center;
      min-height: 100vh;
      background-color: hsl(212, 45%, 89%);
  }
  

  • then you need to update your .container and .attributionin this way:

  .container {
       width: 100%;
       max-width: 350px;
       display: flex;
       justify-content: center;
        align-items: center;
  }
  

  .attribution {
      position: absolute;
      bottom: 0;
      font-size: 16px;
      text-align: center;
  }
  

  Hope I am helpful. :)

  Marked as helpful

  0

  ---

  

  jadilovic•210

  @jadilovicPosted over 1 year ago

  @ecemgo Thanks!

  1