Design comparison
Solution retrospective
I'm proud of how I implemented the hover effect. It added interactivity and improved the visual feedback for user interaction. Next time, I would approach the CSS with more structured classes and perhaps utilize more efficient selectors or frameworks to streamline the styling process. This would ensure cleaner code and easier maintenance in the future.
What challenges did you encounter, and how did you overcome them?Adjusting the positioning of elements, especially text sizes, posed a challenge. To overcome this, I utilized CSS properties such as margin, padding, and flexbox for layout adjustments.
Community feedback
- @MicahtronPosted 5 months ago
Good work, every element's size looks almost exactly like it should relative to each other.
For the background shadow I saw you're using thicker borders on the right and bottom. A cleaner and more flexible way to achieve this would be to use a CSS drop-shadow. This way you can position the BG shadow anywhere you want relative to the card and the offset will match the design better. This also enables you to change the effects if you ever want to use this in another design (color, blur, etc.)
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