NFT Card com flexbox

Hello there 👋. Congratulations on successfully completing the challenge! 🎉

• I have a suggestion regarding your code that I believe will be of great interest to you.

IMPROVING HOVER STATE 🪄:

• I just want to share a small suggestion about the current hover state. I think the borders for the :before is not set so during the hover it looks box in shape. We need to add smooth rounded corners for that.

• You have added border-radius: 7px for img, Instead of adding for that you can add it for image-link anchor tag. It's the parent of both things so we could easily add borders and prevent children overflow using overflow: hidden.

• Here's the example:

.nft-card .image-link {
  overflow: hidden;
  border-radius: 7px;
}

• Now remove this rule,

.nft-card .image-link .image {
  border-radius: 7px;
}

• The change we done will help us to achieve nice rounded corners which is evenly distributed for both img and :before for getting the perfect result!

.

I hope you find this helpful 😄 Above all, the solution you submitted is great !

Happy coding!