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

Updated

Fortunate 10

@Fortunate25

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


Please check and help make corrections when necessary

Community feedback

@im-abhijit

Posted

hi @Fortunate25, congrats on completing this one

you need to put a overlay effect on your image which is missing , rest all looks beautiful

refer to my solution on how i have done

https://github.com/im-abhijit/nft-preview-card-component/tree/main/nft-preview-card-component-main

0

@jonathon-eng

Posted

A few things I noticed on my end:

  1. The font doesn't seem to load the correct font. Looking at your code, the issue seems that even though you linked a google font site to your HTML, it seem to be calling the "Happy Monkey" font, while in your CSS it's asking for the "Outfit" and "Cursive" fonts. I think updating your HTML will solve this.

  2. When hovering over the image part of the card, it doesn't do the part of the task that the challenge is asking for. That being to load an "eye" icon and also changing the color of the image to blue.

0

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