html, css, flexbox

Hello there 👋. Good job on completing the challenge !

I have other suggestions about your code that might interest you.

Alt text 📷:

• The alt attribute should not contain the words "image", "photo", or "picture", because the image tag already conveys that information.

• The alt attribute should explain the purpose of the image. Uppon scanning the QR code, the user will be redirected to the frontendmentor.io website, so a better alt attribute would be QR code to frontendmentor.io

  If you want to learn more about the alt attribute, you can read this article. 📘.

I hope you find it useful! 😄 Above all, the solution you submitted is great!

Happy coding!

Hi @cloudpc7, good job!

Just 2 little things:

• If you want to look it centered, you should add this:

body {
    justify-content: center;
    min-height: 100vh;
}

• I think the margin top on image should be margin-top: 1.5em;

If you want to know the exact measurements for the design, you have a figma file in the starter folder.

I hope these was helpful to you. Regards!

Good start! Here are a few suggestions:

-Consider using 'justify-content: center;' to center the card on the page.

-Try to use classes for styling instead of directly styling elements.

-Implement a CSS reset.

-Avoid specifying fixed heights and widths; try using 'max-height' and 'max-width' for flexibility.

Hello @cloudpc7!

Your project looks great!

I noticed that your card is not completely centered. To place the elemnt in the middle of the page, you can do this:

• Apply this to the body (in order to work properly, you can't use position or margins):

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

I hope it helps!