Design comparison
Solution retrospective
Hi Frontend Mentor peers~
I am uploading this challenge knowing that I haven't complete all the requirement and I need some help.
I have trouble figuring how to make the image to show the viewing icon when the cursor hovers over it, and I don't know where to begin looking for help. I'd appreciate if you can give me some guidance, including good online resources to read, to help me understand what I need to learn.
Secondly, if you have any additional tips on how to improve my code, it's greatly appreciated. #bestpractices
Thank you!
Community feedback
- @ali007-depugPosted over 1 year ago
hello.. first: you have to put the blue image and eye-icon on one div.. second try to center the blue image.. after that.. try to center the eye-icon ... and give it the light blue color.. now you have eye-icon above the blue image.. finally.. set the "opacity" of eye-icon is 0. and on hover.. set it to one..
i hope it helps..
1 - @PapsPythonPosted over 1 year ago
hey mochimoo. I struggled with that as well. I suggest you check out "css combinators" in MDN webdocs and google "how to make an item visible in css".
1
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