QR Code component using HTML, CSS Flexbox

Hi! 👋 Congratulations on completing the challenge!

I have some suggestions to improve the solution:

• Add the following CSS properties to the body to properly center the content on the middle of screen:

height:100vh;
display: grid;
place-items:center:

• Add the following CSS Properties to .attribution:

position:absolute;
bottom:0;

This will place the attribution in bottom.

Happy coding!

When you use flexbox, you have to set the body's height to 100% of the viewport height Then the align items and justify content will work Just like this

body { height: 100vh; display: flex; justify-content: center; align-items: center; }

And justify content is to center it horizontally whilst align items is to center it vertical. I wish you all the best Happy coding

instead of height : 100vh use min-height:100vh