QR-code-component

Community feedback

• 

  Francisldn•250

  @francisldnPosted over 2 years ago

  Hi @NicolasEiriz, regarding your question, this is caused by the default body height setting. Body height is by default set to the height of the elements (.card + .attribution) on the page. So you should add below to expand the body height to 100% of the viewport height. Then flexbox will automatically center the elements.

  body {
  min-height: 100vh;
  }
  

  Refer to this article to learn more.

  Marked as helpful

  0

  ---

  

  Nicolas Eiriz•50

  @NicolasEirizPosted over 2 years ago

  @francisldn Francis thats great! I really have no idea about this, really appreciate, thanks for your time :)

  0
• 

  Sarah Arvin•80

  @Sarah-C-ArvinPosted over 2 years ago

  This looks really good! For the centering issue, try adding min-height: 100vh; in your body styles instead of using margin on your card div, and that should help:)

  Marked as helpful

  0

  ---

  

  Nicolas Eiriz•50

  @NicolasEirizPosted over 2 years ago

  @Sarah-C-Arvin Sarah I tried and its works! thanks for your time :D

  0