QR Code Component

Community feedback

• Account deleted

  Hey Tomatas, You did a great job 😉

  Let me give you some little tips:

  • add main tag and wrap the card for improve the Accessibility
  • remove all margin from card class and use flexbox to the body to center the card. Read here -> 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

  Hope this help! Happy coding 😁 by Travolgi

  Marked as helpful

  1

  ---

  

  tomatas95•50

  @tomatas95Posted over 2 years ago

  @travolgi thank you very much! I'll try my best to remember this and use these in my future projects! <3

  1

  Account deleted

  @tomatas95 You are welcome! Keep it up :)

  0
• 

  Wesley•330

  @wesleyjacobyPosted over 2 years ago

  Hi,

  To center the card/container, you could add the following to the body:

  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  

  The min-height: 100vh being the important bit. Then you can remove the margin-top from the container.

  This is a great article showing different methods of centering in CSS

  I hope this helps!

  Marked as helpful

  1

  ---

  

  tomatas95•50

  @tomatas95Posted over 2 years ago

  @wesleyjacoby thank you very much for your offered help, I'll keep in mind in my future projects as well! :)

  0