Skip to content
Submitted 4 months ago

NFT card challenge

P
Melbita•100
@Melbita
A solution to the NFT preview card component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

What specific areas of your project would you like help with?

The overlay I'm using in the hover state, for some reason is covering a couple more of pixels than the image, Can anyone spot the issue?

Code

Please log in to post a comment

Log in

Community feedback

  • P
    Matthew•360
    @MattJM1007

    Hi Melbita! I've come across this in my own projects. I'm not sure the exact reason this happens, I think it has something to do with there being a space for text under the image. But adding a line-height: 0; to your .card_image class gets rid of that extra space below the image when the overlay is on.

    Hope this helps :)

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