QR code component

Hi, good job on doing this challenge. You can use the readme to describe your working process, reflect on what you found easy/difficult, etc. It's not something you have to write, though.

On to the code...

HTML:

• The alt text also needs to say where it leads (frontendmentor.io).

• The text in .attribution needs to be wrapped in a <p>.

• I would also add the attribution class to the <footer>, and delete the <div>, as you don't really need it.

CSS:

• It's good practice to include a CSS Reset.

• background-color should be set on the body instead of html.

• Font-size must never be in px. Use rem instead.

• Remove all fixed widths. You never want to set fixed widths or heights, unless sometimes for icons.

• Add a max-width of about 20rem to prevent the card from getting too big at larger screens.

To center the card horizontally and vertically, add the following on the body:

display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
min-height: 100vh;

• It's included in the mentioned CSS Reset, but the image needs a display: block and a max-width: 100%. This will prevent it from overflowing its container.

• You only need to write text-align: center once, on the body. The children will inherit the value, so it works just the same, but with one less line of code.

Good luck :)