QR Code Component

@lioba-s

Hiya! 👋

Congratulations on your solution, it looks very close to the design! I can tell you put a lot of effort into it.

Things I like about your solution 🎉

• Responsive
• Use of semantic HTML elements
• Clear descriptive CSS classes
• Use of CSS custom properties

Things you could improve ✍️

• You can remove flex: initial; and position: relative; on your body element. I think you left these while experimenting. As far as I can see they don't make a difference while trying to achieve your result.

• Try to get into the habit of using classes more instead of ID's for styling your elements.

• Try experimenting more with Flexbox, the gap property is very useful for example.

I hope you find my feedback valuable, and I would appreciate it greatly if you could mark my comment as helpful if it was! 🌟

Let me know if you have more questions and I'll do my best to answer them. 🙋‍♂️

Happy coding! 😎

Hello there!

Congrats on completing the challenge! ✅

Your solution looks awesome!

I saw that you used ID's and Classes on your project. They both work well but hey have a few differences:

ID’s are unique

📌 Each element can have only one ID.

📌 Each ID can have an unlimited amount of Styles applied to it.

📌 Each page can have only one element with that ID.

📌 IDs use “#” in the CSS which can also be used as an identifier for HTML “Jump Links” (hyperlinks). This allows you to jump from one place to another on the same web page and can also be used in creating a well-designed Table of Contents.

Classes are not unique

📌 You can use the same Class on multiple elements.

📌 Class naming is case sensitive.

📌 Classes use a “.” in front of the name in the CSS.

📌 Each Class can have an unlimited amount of Styles applied to it.

📌 You can use multiple classes on the same element.

I hope it helps!

Other than that, you did an excellent job!