Responsive page using flexbox

Community feedback

• 

  Travolgi 🍕•31,400

  @denieldenPosted almost 2 years ago

  Hello Pedro, You have done a good work! 😁

  Some little tips to improve your code:

  • use main tag to wrap the card and improve the Accessibility but not as a container of that one element
  • also you can use article tag instead of a simple div to the container card for improve the Accessibility
  • remove all margin from qr-container class because with flex they are superfluous
  • use min-height: 100vh to body instead of height, otherwise the content is cut off when the browser height is less than the content
  • instead of using px use relative units of measurement like rem -> read here

  Keep learning how to code with your amazing solutions to challenges.

  Hope this help 😉 and Happy coding!

  Marked as helpful

  1

  ---

  

  Pedro Sena•30

  @pedrosenavPosted almost 2 years ago

  @denielden Hello Deniel, really appreciate those tips!! I usually get a little lost when using other semantic divs other than section and main. I'll work to fully using realtive units, is a new ground for me now. Those little details certainly will improve my code, one again, thank you very much!

  1

  

  Travolgi 🍕•31,400

  @denieldenPosted almost 2 years ago

  @pedrosenav You are welcome and keep it up :)

  0
• 

  Rachit Patel•540

  @rachit0706Posted almost 2 years ago

  Congratulations for completing the challenge! . Everything looks great but the only issue I found was that you forgot to use flex-direction: column; inside the body tag. This will properly center the component in the page and will match the design.

  Marked as helpful

  1

  ---

  

  Pedro Sena•30

  @pedrosenavPosted almost 2 years ago

  @rachit0706 Oh yes, I commited the version without this fix, now it is working properly. Thanks for the tip!

  0