QR-Code-Component

Hi, well done for your solution ! 😁

I have a suggestion to improve your solution :

• Your card seems to not be correctly center on the page
• You can use the properties display: flex;, align-items: center;, justify-content: center;, in order to correctly center your card
• You can remove the property margin-top: 4rem; and margin-top: 10rem;

CSS :

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

I hope you'll find this helpful, BTW your solution is great 😁

Hey Ty,

Good work on another project finished!

I noticed the HTML validation report flags, and found some material on MDN that may help to remedy the issue:

“By default, many semantic elements in HTML have a role; for example, <input type="radio"> has the "radio" role. Non-semantic elements in HTML do not have a role; <div> and <span> without added semantics return null. The role attribute can provide semantics.”

Nice use of rems in your sizing! I’m learning more about the relationship between accessibility and the use of rem/em’s. Appreciate the exposure to custom CSS properties, I haven’t seen that use yet.

I’m really curious in seeing your design process in a readme.