Design comparison
SolutionDesign
Solution retrospective
Difficulties while making the Component :
- I found a little bit difficult to make the overlay on image and placing the view-icon on the center while we hover.
- It also took me time to align the price text & time remaining text with the etherium & clock icon as I used
::before
pseudo class to add the icons before the text. I've to give the pseudo classesdisplay:flex;
&align-items:center
to align the pseudo elements with the text in the center. I've used total three approaches for doing the overlay & 2 approaches for aligning the pseudo elements.
Question :
Can I do it better using something more better elements & properties ? If so please suggest me feedback. ?
Your feedbacks are very appreciated : )
Community feedback
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