QR Code Card using HTML & CSS

Community feedback

• 

  Lucas 👾•104,400

  @correlucasPosted about 2 years ago

  👾CIAO! Tyler, congratulations for your first solution and 😎 welcome to the Frontend Mentor Coding Community!

  Unfortunately I've to break the first rule of the Frontend Mentor Fight club and talk about it. To improve even more your solution you need to give it the properly vertical alignment, here's how you can do it:

  My advice for your is to use flexbox to create this alignment. For example, first of all add to the body min-height: 100vh to make the body display 100% of the browser screen size and display: flex e flex-direction: column to align the child element (the container) vertically using the body as reference.

  body {
      min-height: 100vh;
      background-color: hsl(212, 45%, 89%);
      font-size: 15px;
      font-family: 'Outfit', sans-serif;
      display: flex;
      align-items: center;
      justify-content: center;
  }
  

  👋 I hope this helps you and happy coding!

  Marked as helpful

  1

  ---

  

  Tylerdurden230•120

  @TylerDurden230Posted about 2 years ago

  @correlucas Thank You Lucas for the advice! I have submitted my solution just to see the differences. I'm going to improve it following your advice and send it again.

  I've Really appreciated the quote.

  1