Submitted over 2 years ago

NFT Card built using CSS and HTML

#vanilla-extract

Jeremiah Lateef• 160

@jeremiahlateef

Preview site View code

This is a solution for...

NFT preview card component

HTML
CSS

1newbie

View challenge

Design comparison

SolutionDesign

Solution retrospective

I don't think I have any specific questions but I believe detailing some of the challenges I faced may help another person who may want to attempt the challenge.

Try and learn the basics of properties such as min-height, min-width, and percentages before embarking on the project.
Learn how to center an image.
Learn the basics of CSS Flexbox as you may likely need it.
Use the font-size you're comfortable with.
Always believe in yourself when you experience challenges (I experienced a whole lot but I never gave up).
Breaks are allowed. Don't beat yourself up too much.

I wish you good luck in solving the challenge.

Community feedback

Web Wizard• 5,690

@rsrclab

Posted over 2 years ago

Hi, @Jerryl-597 ~

Congratulate on your solution to the challenge on FM platform. I have studied your work carefully and learned a lot from it. Especially I like the way you did image overlay.

Here are some of the tips I like to provide.

You can add cursor: pointer to hoverable elements.
Try BEM for structuring elements.
You can add transition on heading and creator name.

https://www.frontendmentor.io/solutions/my-first-solution-on-chanllenge-V-4IzAivH

Here is my solution to this challenge, and if it can help you even a bit, it would be happy to me.

Cheers ~

Marked as helpful

Jeremiah Lateef• 160

@jeremiahlateef

Posted over 2 years ago

Thank you so much, Peter, for the awesome feedback. I didn't expect someone to review it so soon. On the second recommendation, I do not know what a 'BEM' structure is. Could you care to elaborate more on it? On the third recommendation, I didn't think it was important to add a transition to both elements, but will now apply it on both elements and on future projects. Thank you for the first recommendation. I really appreciate it.

Kind Regards, Jeremiah Lateef.

Please log in to post a comment

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