QR-code component by using HTML & CSS

Please log in to post a comment
Log in with GitHubCommunity feedback
- @sadhap
thank you so much !
- @jessegood
Here are a few points I saw. Hopefully this helps.
(1) Looks like you mispelled
card-img-containere
which is causing some of the styles not to work.(2) I would recommend not wrapping everything in a
div
and it will cut down on how much styling you have to use.(3) The other comment already addressed it, but using a main landmark for accessibility is also a plus.
- @romila2003
Hi @sadhap,
Welcome to the frontend mentor community and congratulations for 🎉 for completing your first challenge, the card looks great. There are some issues I want to address:
- It is best practice to wrap the main content within the
main tag
which would ensure that your content is wrapped within the correct landmarks e.g.<main class="container"></main>
- The img should have a border-radius.
- You can set the font-size for the
h1
tag to be bigger - Instead of using the
margin
property to center the card, you can use theflex
property instead e.g.
body { display: flex; align-items: center; justify-content: center; min-height: 100vh; }
Overall, great attempt and wish you the best for your future projects so keep coding 👍.
- It is best practice to wrap the main content within the
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord