Design comparison
Solution retrospective
This was a very good challenge for practicing flexbox and positioning, however I was a bit unprepared for the active states required. The view icon appearing when hovering over the image gave me quite some trouble, but I believe I have come up with a good solution. I tried two different ways, having the image be in the background or positioning the <div> with the icon over top of the image. I ended up positioning the elements over one another. I am unsure if this is the preferred way to go about this, but it seems to work just fine.
Once again, any feedback or useful tips are very appreciated!
Community feedback
- @Claireb0125Posted about 2 years ago
Your solution seems to have worked out wonderfully!! I also had a issue with the hover element and icon but you seem to have a cleaner look so I will take your method into consideration for the future. The only advice I can give is the same that I received which is that I tend to rely on <div>'s far to often when other interactive sections exist like header/main/section/footer and such (which you did utilize some!) otherwise wonderful solution!!
0
Please log in to post a comment
Log in with GitHub
Join 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