Responsive QR component made with HTML & CSS

Hello Jorge, You have done a good work! 😁

Some little tips to improve your code:

• add main tag and wrap the card for improve the Accessibility
• also you can use article tag instead of a simple div to the container card for improve the Accessibility
• to make it look as close to the design as possible remove heigth to .card class
• remove all margin from .card class
• use flexbox to the body to center the card. Read here -> best flex guide
• after, add min-height: 100vh to body because Flexbox aligns child items to the size of the parent container
• instead of using px or % use relative units of measurement like rem -> read here

Keep learning how to code with your amazing solutions to challenges.

Hope this help 😉 and Happy coding!

Hi Jorge Adalberto, how are you? Welcome to the front-end mentor community! I really liked the result of your project, but I have some tips that I think you will enjoy:

A tip to facilitate the responsiveness of the project is to use absolute measurement units in consuming larger or maximum width! and leave the relative units of measurement only for younger children!

To align some content in the center of the screen, always prefer to use display: flex; it will make the layout more responsive!

body {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    min-height: 100vh;
}

The rest is great!

I hope it helps... 👍