Design comparison
Community feedback
- @correlucasPosted about 2 years ago
👾Hi Ezequiel, congrats on completing this challenge!
I saw your preview site and I liked a lot the work you’ve done here, it's almost complete, I’ve some suggestions you can consider applying to your code:
Use
<main>
instead of<div>
to wrap the card container, its better to use<main>
in this case because you’re indicating that’s the main block of content of this page and also because<div>
doesn’t have any meaning, it's just a block element.Your solution is great and the code is working, but the html structure can be reduced by removing unnecessary divs, all you need is a single
<main>
or<div>
to keep all the content inside, and nothing more. The ideal structure is thediv
and only the image, heading and paragraph.Here’s one example to show can be cleaner this HTML structure:
<body> <main> <img src="./images/image-qr-code.png" alt="Qr Code Image" > <h1>Improve your front-end skills by building projects</h1> <p>Scan the QR code to visit Frontend Mentor and take your coding skills to the next level</p> </main> </body>
✌️ I hope this helps you and happy coding!
Marked as helpful0@rrettaPosted about 2 years ago@correlucas ty bro, you right, in the last month i learning React and only use div and fragments to my code :P i forget to apply some HTML concepts. ✌️
1
Please log in to post a comment
Log in with GitHubJoin 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