Frontend Mentor | QR code component with HTML and CSS coding challenge solution

Community feedback

@NehalSahu8055

Posted over 1 year ago

Hello Coder 👋.

Congratulations on successfully completing the challenge! 🎉

Few suggestions regarding design.

➨Remove margins from .card as this will not dynamically center the card.

➨ You are already using flex just add min-height:100vh to your body and see the effect.

body{
min-height: 100vh;
}

➨ Use Semantics for the proper design of your code.

<body>
<header>
<nav>...</nav>
</header>
<main>...</main>
<footer>...</footer>
wrap up `.attribution` inside `footer`
</body>

Every site must have one h1 element describing the main content of the page.
So, Add a level-one heading instead of h3 to improve accessibility.
For non-decorative images give meaningful and descriptive alt like alt= "QR code to Frontend Mentor website".
Don't use <b> for bolding the heading use font-weight.
Use responsive units(rem, em, %) from next project. Explore respective use cases on google.

I hope you find this helpful.

Happy coding😄

Marked as helpful

QR code component with HTML and CSS