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-main using HTML CSS only !

@ahmed9143

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


this simple card made using html css please give me your feedback to improve myself and thanks

Community feedback

Mika 230

@mikatechs

Posted

Congratulations on finishing up this project. As I have seen your code, it seems you might have missed the hover effects. There are many ways of creating it, but I can recommend that might help you in getting started. In order to make a hover effect on the main image, try creating overlay element with specific sizes, set it's position to absolute, and set parent container as a relative so it can be positioned perfectly under main image, than set its opacity to 0 until hovered. Also, there are icons missing from your project or not displaying properly. Assests are provided in starter files in images folder. Do not forget to set Jules Wyvern as a link and create hover effect on that also.

Good luck and happy coding.

Marked as helpful

0

@ahmed9143

Posted

@mikatechs thanks For these great tips i will apply it to this card , appritiated that

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