simple html and css QR code design

Replace <div class="card"> with the main tag, <h4> with <h1> and <div class="attribution"> with the footer tag to fix the accessibility issues. for more on semantic html visit https://web.dev/learn/html/semantic-html/

To center .card on the page page, add min-height:100vh; display: flex; align-items: center: justify-content: center; or min-height:100vh; display: grid place-items: center to the body.

For a responsive content use max-width instead of width. you won't require a media query for this challenge when you use the max-width.

There is no need to give .card and img display: inline-block. Give the max-width of .card a fixed value instead of a percentage value.

Give img a max-width of 100%, there is no need to give img a padding value but rather give .card a padding value for all the sides for the space between it and its content.

Use rem or em as unit for the padding, margin, width and preferably rem for the font-size for more on this watch this https://youtu.be/N5wpD9Ov_To

Hope am helpful HAPPY CODING

Hey there! 👋 Here are some suggestions to help improve your code:

Congrats on completing your first challenge!🎊🎆

• It is best practice to have separate files for you HTML and CSS code. It helps keep things organized and make it easier to maintain.

• To properly center your content to your page, you will want to add the following to your body element (this method uses CSS Grid):

body {
    min-height: 100vh;
    display: grid;
    place-content: center;
}

More Info:📚

[Centering in CSS][https://moderncss.dev/complete-guide-to-centering-in-css/]

• Do not use percentages for your component's container as it cause it to grow/shrink indefinitely, which will cause your component to warp.

• Change width to max-width in your component’s container to make it responsive.

• Change width to max-width: 100% in your image to make it responsive.

• A media query is not needed for this challenge. Using responsive properties will do in making your content responsive.

If you have any questions or need further clarification, feel free to reach out to me.

Happy Coding!🎄🎁

it is great work you have done but you need to focus more on making it responsive you can use media query or use non fixed width and height measurements like percentages.