Submitted over 1 year ago

NFT preview card using flexbox and :hover

@Nospiel-code

A solution to the NFT preview card component challenge

Solution retrospective

Hey everyone, I have one question, when I hover over the image I see that the image div with the gradient is a bit higher than the image itself. I couldn't figure out what to do to get it to be the same size. Thanks for any help :)

Code

Please log in to post a comment

Community feedback

Jakub Serok•510
@jakubSerok
Posted over 1 year ago
Hello, try to set background-img in <div class="image"> then add a subdiv with icon. Set height and width for subdiv for 100% and it should work.

somthing like that in your project:

<div class="image"> <--"here set a backgrand image"
```
    <img class="view" src="images/icon-view.svg" alt="">
</div>
```
you can check it in my project
Marked as helpful

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