QR Code component with CSS flexbox

Community feedback

• 

  

  Chamu•13,820

  @ChamuMutezva

  Posted over 1 year ago

  • the body is usually set to min-height: 100vh , I would go on and say that should be the best practice.
  • the image should have an alt value, it seems to me to carry a message. The message could be something like alt="QR code for Frontend mentor"
  • landmark elements are one of the building blocks of a website, this challenge should at least have the main element.
  • for font sizes , it is recommended to use rems - using px values is not recommended. See the following article for further explanation. Why font-size must NEVER be in pixels

  Happy coding

  12

  Marked as helpful
• 

  John Carruthers•310

  @techyjc

  Posted over 1 year ago

  vh doesn’t take into account address bar in mobile browsers or non floating scroll bars. There is the dvh option dynamic viewport height sizing but it lacks full browser support. The video below covers sizing containers and then use flexbox Justify-content and aligh-items to center the Flexbox content.

  This YT video might help… (https://youtu.be/-sF5KsEo6gM?si=vpMXHedXC4cfjVP7)

  11

  Marked as helpful