Frontend Mentor - NFT preview card component
Design comparison
Solution retrospective
How do you change the color of the horizontal line? How do you work in the active state to the image? How can I make the Desktop version look more like the challenge?
Community feedback
- @elaineleungPosted about 2 years ago
Hi Luis, just wanted to answer some of your questions:
To change the color of the line, try using
opacity: 0.4
to start, and then adjust as you see fit.To make the design look more like the original, try putting
width: min(100%, 21.85rem)
on the card, and give it apadding: 1.5rem
instead of what you have; also, I'd remove all the padding from thecard__img
andcard__body
and only have the padding that's on the card. Lastly, I would change the width ofimg
andcard__body
to 100%.I also completed this challenge; you can see whether some of my code could help you: https://www.frontendmentor.io/solutions/reponsive-nft-preview-component-W2gWx-dAyA
Good luck!
Marked as helpful0@Luis-OliveroPosted about 2 years agoHello @elaineleung,
Thank you so much, you have been so helpful.
0@Luis-OliveroPosted about 2 years agoHello @elaineleung,
Thank you so much, you have been so helpful.
1
Please log in to post a comment
Log in with GitHubJoin 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