Simple QR-Code component using HTML & CSS with Flexbox

Hey good job completing this challenge

Keep up the good work

Your solution looks great however I think that the title of the card is supposed to have a bold font weight and the description should have a heavier font weight

In terms of accessibility issues simply wrap all your content between main tags

I hope this helps

Cheers Happy coding 👍

Hi @luciferad,

Yes that's okay, it essentially means that the body will take in the whole height of the viewport. Instead of Flexbox you could also use Grid with only two lines to center your card. This is how I would do it:

html, body { width: 100%; height: 100%; }

body { display: grid; place-items: center; }

Yes, that is fine. You can totally do that!

As an alternative to flexbox you can use grid to center the card on the page. Works great in challenges like this. use height: 100vh, display: grid;, and place-items: center; on the body or other wrapper element for the element you want to center on the page.

Have fun coding!