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 solution

Joy 80

@joykara

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


Are there any other best practices for handling the hover in CSS? What else could I use other than the <div> classes in HTML?

Community feedback

@purnimakumarr

Posted

Hi Joy,

Congrats on completing the challenge 🙌

Regarding you question about hover effect: I reviewed your code and the way you added style for a hover state looks good and acceptable. I would suggest to always use transition property while working with hover states. It makes the hover effect more smooth and pleasent looking. In your code you can add transition: all 0.3s to the .image component and h3 tag.

Some suggestion by me: I see there is 1 accessibility issue in your code i.e. beacuse you didn't use an h1 tag in your solution. The first heading of any website should always be wrapped by an h1 tag as it makes the the website more accessible. h1 as the name of the tag suggests is used for the first heading a website. So, you can replace your h3 tag with an h1

Marked as helpful

1

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