Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

NFT Preview Card Component

auriga 210

@auriga2124

Desktop design screenshot for the NFT preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


I would love to know if there is any suggestions how to make a better overlay image effect? Thanks.

Community feedback

David 8,000

@DavidMorgade

Posted

Hello Auriga, congrats on finishing the challenge! pretty nice job, almost got it pixel perfect

To answer your question, there are various ways of getting this effect, one of them being the wrapper div that you used, other one is using the ::before pseudoelement but this one is harder to transition, you could also use a mouseover event with Javascript, but that would be consuming more resources that doing it only with CSS.

I think that the best one to use is the one that you used (wrapper div), and you should stick to it!

Hope my feedback helps you!

0

auriga 210

@auriga2124

Posted

@DavidMorgade Thank you David for the feedback.

1

Please log in to post a comment

Log in with GitHub
Discord logo

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