Desktop-first QR code component

Community feedback

• 

  Nícolas Gabriel•140

  @Nick-GabePosted almost 3 years ago

  Good work, very organized html! :)

  I noticed your qr-code is on the upper left. A tip I give is that to center the container on the screen, one option is using flexbox on the body and defining a height (100vh is good for desktop, but doesn't work well for mobile) and a witdh (100%).

  body {
      width: 100%;
      height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
  }
  

  Links if you want to see more: Flexbox, Css Units(vh, vw...)

  Marked as helpful

  1

  ---

  

  Sandra Ise•20

  @sandraisePosted almost 3 years ago

  @Nick-Gabe Thanks, I'll look into that vh unit this week. That has trimmed off a bunch of lines off my code, great!

  0
• 

  Dev Rathore•2,600

  @GitHub-dev12345Posted almost 3 years ago

  Use this code in the body tag :-

  Padding :10px; Margin : 110px auto: Width: 100%; Max-Width: 1440px;

  Marked as helpful

  1

  ---

  

  Sandra Ise•20

  @sandraisePosted almost 3 years ago

  @GitHub-dev12345 Ok thank you!! That's much better. I will practice responsiveness on other challenges Cheers!

  0