Responsive QR scanner card

Community feedback

• 

  Damian•150

  @damiandev22Posted about 2 years ago

  congrats on your attempt.

  To fix the ACCESSIBILITY ISSUES you should

  • wrap the main content inside the "main" tag
  • wrap the atribution content inside the "footer" tag
  • use an "h1" in the page. The h5 you are using could be an h1 and be centered (text-align: center;) to achieve a result more similar to the design.

  0
• 

  Adriel Murray•90

  @AdrielMurrayPosted about 2 years ago

  Great job @parvezalam19 on your first attempt. If you want to center .card-title. You should try text-align: center.

  0

  ---

  

  Parvez Alam•10

  @parvezalam19Posted about 2 years ago

  @AdrielMurray i did it but didn't work

  0
• 

  Hyron•5,870

  @hyrongennikePosted about 2 years ago

  Hi @parvezalam19,

  Good job on your first attempt

  If you want to center something vertically and horizontally on the page do the following on the parent element.

  .container.mx-auto {
      display: flex;
      justify-content: center;
      align-items: center;
      min-height: 100vh;
  }
  

  also remove the margin by adding this

  .card.mx-auto.card-1{
      margin: 0;
  }```
  
  and then just check the report and fix the accessibility issue. Hope this is helpful.
  

  0