Design comparison
SolutionDesign
Community feedback
- @fatlindshehuPosted over 2 years ago
Hi,
Your component looks good, but you have a hover state you need to work on, in case you don't know how to approach that, here's my suggestion:
- Create a
div
and place it above the image, usingposition: absolute
- Center the div:
display: flex to **set** the *div/component* as a *flex container*. justify-content: center to **center** the *div/component* horizontally. align-items: center to **center** the *div/component* vertically.
- Set div
opacity: 0
to hide thediv
on normal state. - Set div:hover
opacity: 1
to show the div on the hover state, make sure you add the background based on the instructions given by Frontend Mentor
Keep up the good work!
Marked as helpful0@IrfanAshraf-proPosted over 2 years ago@fatlindshehu Thanks, I didn't remember it but will do now
0 - Create a
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