
Design comparison
Community feedback
- @al-ameen36Posted 6 days ago
Fantastic work, Olha!
It's great to see you building with a mobile-first approach—that’s a solid foundation! Plus, using CSS variables is a smart choice, making your styles more reusable and easy to customize.
Here are a few improvements to refine your code even more:
Clean Up Unused CSS
Always remove any unused IDs or classes to keep your code clean and efficient. For example, in:<article class="card" id="card">
Since there are no other elements sharing
.card
styles, you can simplify it by just using an ID or a class, not both.Use Semantic HTML
Try to replace<div>
with<section>
where appropriate. This improves accessibility and makes your code more meaningful.Keep Up the Great Work!
0P@Oliko136Posted 6 days ago@al-ameen36 Thank you very much for such a detailed feedback! Regarding article selectors, class is for CSS styling and id is for JavaScript, so they are both needed because they serve different purposes. But your comment led me to a realization that I should add "-js" to id names, e.g. id="card-js". This would make selectors more readable and their purpose more understandable to other developers.
0@al-ameen36Posted 5 days ago@Oliko136 You can use the id for the styling as well. It's fine though. I always try to keep my code as lean as possible
0
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