QR-CODE: First Project HTML and CSS

Community feedback

• 

  Blagoj•130

  @BagataaPosted over 1 year ago

  Hey, you can easily center your card with Flex. In the body element, you should give height:100vh body { display: flex; justify-content: center; align-items: center; height:100vh } And you must delete the padding from the body you don't need it. Tip: U don't need flex-direction: row, By default, the flex items are placed in the row direction. HAPPY CODING

  Marked as helpful

  3

  ---

  

  YannickMukeng•20

  @YannickMukengPosted over 1 year ago

  Thank you for the feedback! Very helpful! :) @Bagataa

  0
• 

  Francesco Merighi•930

  @francescomerighi1202Posted over 1 year ago

  To perfectly center an element within the page you can use flexbox or grid.

  Unfortunately the code on GitHub is not visible but I understand that you used flexbox to center it horizontally, you can also use it to center it vertically, thanks to the property 'align-items: center'

  Set a height of 100vh to the body, or the (parent) div that contains the card.

  I hope I was helpful, anyway, if you need, you can check my solution ;)

  Marked as helpful

  3

  ---

  

  YannickMukeng•20

  @YannickMukengPosted over 1 year ago

  Thank you very much for your comment! I corrected it! @francescomerighi1202

  1

  

  Francesco Merighi•930

  @francescomerighi1202Posted over 1 year ago

  @YannickMukeng no problem, always glad to help

  0
• 

  Udbhav Dalmia•150

  @UdbhavDalmiaPosted over 1 year ago

  You can add flex but you can also add margin right and left: auto; it would center it horizontally and make sure to do display: block; so it would be horizontally centered.

  Upload the QR code image and the favicon in the GitHub repository then they will show.

  0

  ---

  

  YannickMukeng•20

  @YannickMukengPosted over 1 year ago

  Thank you very much!@UdbhavDalmia

  0