QR code component using Semantic HTML markup and CSS custom properties

Hey!! Cheers 🥂 on completing this challenge.. .

Here are my suggestions..

• You should use <main class="container"> instead of <div class="container">.
• Go down orderly when you are using the headings h1 down to h2 down to h3 and so on.
• You can wrapper your attribution section in a footer tag to avoid accessibility issues.
• You should also add alternative text to your images to aid screen readers.
• You should use rem or em instead of px.

. Regardless you did amazing... hope you find this useful... Happy coding!!!

Hey KIMHYUNWON, congratulations on completing the challenge! You did a great job 😉

Let me give you some little tips for optimizing your code:

• add main tag and wrap the card for improve the Accessibility
• img element must have an alt attribute, it's very important!
• remove all unnecessary code, the less you write the better as well as being clearer: for example the p container of image
• to make it look as close to the design as possible set width: 20rem and padding: 1rem to container id
• set width: 100% to img element
• remove all margin from container id
• 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 use relative units of measurement like rem -> read here

Hope this help! Happy coding 😁