QR Code Component challenge using Flexbox

Community feedback

• 

  Mohammed Ahmad Hussain•200

  @mah07308Posted over 1 year ago

  Hello,

  Great job completing your first challenge. It looks great on the desktop, but not so good on the mobile because you used margin: 10rem auto; on your main .container.

  I have a few suggestions to fix that :

  • Add to your main tag min-height: 100vh; This will center your card without having to add margins.

  • Remove from your main .container : min-height: 45vh; margin: 10rem auto; padding-top: 0px;

  • Add to your main .container : margin: 1rem;

  This will make the design look good both on small screens and large screens.

  Hope this helps.

  Marked as helpful

  1

  ---

  

  Samara Silva•70

  @samarasilva18Posted over 1 year ago

  @mah07308 Thanks so much!! I used your suggestions and the solution looks so much better now! Thanks a lot!

  1