Skip to content
Submitted over 2 years ago

NFT Card

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

Solution retrospective

Wondering if the part with hovering over the main image was done okay or if there's a shorter/better way to do it.

Also wondering about any redundant values I specified anywhere.

Code

Please log in to post a comment

Log in

Community feedback

  • P
    visualdennis•8,375
    @visualdenniss

    Hello Ferdi,

    good work with the NFT Card!

    Hovering seems fine, just the border-radius of the overlay and the image does not match. Image has border-radius: 10px; while overlay has border-radius: 20px; so you might consider syncing them. Also if u want you can add some smooth transition to overlay like transition: all .4s ease;

    Also you don't need this: height: 66vh; in fact avoid fixed heights as much as possible. min-height is fine.

    Hope you find this feedback helpful!

    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