Design comparison
SolutionDesign
Solution retrospective
What specific areas of your project would you like help with?
Feel free to tell me what can i do to improve my solution :) !
Community feedback
- @StroudyPosted 2 months ago
Hello again, Good to see you complete another challenge, Awesome job tackling this challenge! You’re doing amazing, and I wanted to share a couple of suggestions that might help refine your approach…
- Your
<ul> <li>
text should be wrapped with a<a>
, Currently the<a>
is not wrapping anything, This is so it is accessible with a keyboard using the tab key, improves accessibility for screen readers, and ensures consistent behavior across browsers, unlike a<button>
not intended for links.
❌<ul> <li><a href="#"></a>GitHub</li> <li><a href="#"></a>Frontend Mentor</li> <li><a href="#"></a>LinkedIn</li> <li><a href="#"></a>Twitter</li> <li><a href="#"></a>Instagram</li> </ul>
✅ <ul> <li><a href="#">GitHub</a></li> <li><a href="#">Frontend Mentor</a></li> <li><a href="#">LinkedIn</a></li> <li><a href="#">Twitter</a></li> <li><a href="#">Instagram</a></li> </ul>
- Avoid using
id
selectors for styling in CSS because they are too specific and hard to override, making your styles less flexible and maintainable. Instead, use class selectors (.
), which are reusable and more manageable, allowing for better control over your styles and easier updates.
Your CSS is looking much more responsive, I hope you found this advice helpful! Keep up the great work, and don’t forget to dive deeper into the details. You’re doing amazing, and I can’t wait to see what you create next. Happy coding! 🚀
Marked as helpful0 - Your
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