CSS Flexbox, HTML5

What challenges did you encounter, and how did you overcome them?

While solving the QR code challenge I had problems centering the qr code image. After a little online search, I learned that images act funny in a div because we're forcing an inline element (img) inside a block element (div). I learned two ways to tackle this problem but I used the one I preferred 👇👇👇👇👇

👇 To see how you can add code snippets, see below 👇:

  .qr-code {
    margin-top: 10px;
    width: 95%;
    height: 100%;
  }

  #qr-code {
    padding: 5px;
    display: block;
    margin: auto;
    box-sizing: border-box;
    width: 100%;
    border-radius: 15px;
    object-fit: contain;
  }

What specific areas of your project would you like help with?

Responsive Layouts