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 Card

P

@Stephanie-Dennehy

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


Hi! This is the first challenge I have completed. I'd love some feedback regarding my HTML structure. I want to make sure that I'm using best practices as I create new files.

I also had a hard time getting the "view icon" to show up correctly on the image hover. If anyone can tell me what I did wrong here, I'd appreciate it! I tried multiple solutions and couldn't manage to get that part right.

Community feedback

Aravindhan 320

@aravindhan7

Posted

For an idea of best practise for HTML, kindly go thru below blog https://www.freecodecamp.org/news/html-best-practices/

and the eye icon simply you play with the opacity

first create the eye icon with blue background and set over the image and give opactity 0

while hover, you change the opacity to 1.

Hope this is useful for you!.

Marked as helpful

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