QR Code Component

Community feedback

• 

  Travolgi 🍕•31,400

  @denieldenPosted over 2 years ago

  Hi Dallas, great work on this challenge! 😉

  Here are a few tips for improve your code:

  • remove all unnecessary code, the less you write the better as well as being clearer: for example the html comment
  • remove all margin from .container class
  • use flexbox to the body to center the card. Read here -> best flex guide
  • after, add min-height: 100vh to body because Flexbox aligns child items to the size of the parent container
  • instead of using px use relative units of measurement like rem -> read here

  Overall you did well 😁 Hope this help!

  Marked as helpful

  0

  ---

  

  Dallas Viars•20

  @DallasViarsPosted over 2 years ago

  @denielden and @denisomarcuyottito Thank you for the help! When I did this I was mostly trying to get through it as I struggle through using VS Code + Github instead of through Codepen.io. Honestly I'd not considered adding flexbox to the body tag before and that worked really well.

  When I checked the accessibility rating on this it says I have one regarding not having a landmark around the attribution div, but I have one there. Any ideas on how to fix that?

  1

  

  Travolgi 🍕•31,400

  @denieldenPosted over 2 years ago

  @DallasViars You can wrap it with footer tag. Happy coding :)

  0
• 

  Denis Omar Cuyo Ttito•350

  @OTF31Posted over 2 years ago

  Hi, to center horizontally and vertically you could use flex with justify-content: center and align-items: center.

  And you could use Pixel Perfext to have a design closer to the solution.

  Have a nice day.

  Marked as helpful

  0