Design comparison
Solution retrospective
I learnt how to use tabindex to make a non-Interactive elements like h1 to use pseudo class focus. this is by use tabindex="".
I also learnt about box-shadows
Community feedback
- @lia-oliveiraPosted about 20 hours ago
Excellent work! Your solution is very close to the original. You’re using advanced CSS techniques for selecting elements, variables for reusable properties like colors, and responsive units—great job! What suggestions could I offer for improvement?
Perhaps:
Adding a hover state to the link so it changes color when the mouse hovers over the title. This feature was mentioned in the project description on the Frontend Mentor site (though not included in the downloaded files). Currently, the color change happens only when users use the Tab key to access links.
Paying attention to small details, such as the card’s border-radius, which should be double that of the image (20px vs. 10px). In your solution, both are set to the same value (10px). The line-height (150%) also wasn't applied.
Overall, outstanding work!
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