Skip to content
Submitted over 2 years ago

NFT preview card component

Nelson Rosario•50
@NellyisDevv
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...NFT preview card component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

I was wondering if anyone could help me with the hover affect on this card, I was not sure how to make it appear on the hover, Thanks!

Community feedback

  • IRVINE MESA•1,855
    @DrMESAZIMPosted over 2 years ago

    hi Nelson

    I observed that your active states on hover are not having effects here are the styling I added for the hover effect to have effect

    .qr-main-content h2:hover{ color:hsl(178, 100%, 50%); cursor: pointer; }

    #jules:hover{ color:hsl(178, 100%, 50%); cursor: pointer; }

    main .qr-image div img{

    position: absolute; left: 50%; top: 60%; transform: translate(-50%, -60%); opacity: 0;

    }

    main .qr-image div img:hover {

    opacity: 1;

    cursor: pointer;

    }

    0

Please log in to post a comment

Log in with GitHub

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