QR component using semantic HTML and Flexbox

Community feedback

• 

  faizan•2,420

  @afaiz-spacePosted over 2 years ago

  Hey @maudlinmandrake,

  • Remove height from the html element.
  • Replace height:100vh with min-height:100vh in the bodyelement.
  • Remove height from the container class.
  • Replace box-shadow: 2px 5px 500px hsl(220deg 15% 55%); with box-shadow: 0 0 10px 2px hsl(220deg 15% 55%); in the .qr-code class.

  0

  ---

  

  Jenny Mikac•20

  @maudlinmandrakePosted over 2 years ago

  @afaiz-space Hey, thanks for such speedy feedback! I would love it if you could provide an explanation behind the first three points though. Being told a fix is great, but having the reasons behind the fix would be much more helpful for me in the future!

  EDIT: I just went back and tested it. The first three changes you suggested actually broke the vertical alignment. Thanks, though!

  0

  

  faizan•2,420

  @afaiz-spacePosted over 2 years ago

  @maudlinmandrake

  • no need height in the html element.
  • Min height 100vh means the element should occupy the web browser viewport height.

  0