Design comparison
Solution retrospective
Here's my solution: I have faced problems with the hover effect, but I still manage to pull it off, and it does not align perfectly. I am here to listen to your suggestions.
Community feedback
- @CodeWithAlaminPosted almost 2 years ago
Hi Pankaj Bisenπ Great job on completing this challenge! π₯³
Overall, your code for the NFT preview card component is well-organized and easy to read. You have used good formatting practices, such as indenting nested elements and using descriptive class names, which makes the code easy to understand.
One thing that I noticed is that you have included some duplicate styles in your CSS code. For example, you have defined the same styles for the .
element img
and .element .overlay
selectors multiple times. To make your code more efficient, you should remove these duplicate styles and ensure that each style is only defined once.Another thing you could consider is using more semantic HTML tags to better convey the purpose of each element in your code. For example, instead of using a
div
element for the main container, you could use asection
element. This would make your code easier for others to understand and maintain.Overall, your code is a good start for creating an NFT preview card component. With a few adjustments, it could be even better! Keep up the good work.
Overall, this is a very well done solution to the challenge. Great job!
I hope this feedback was helpful. π Keep up the good work!π
1@packerpotPosted almost 2 years agoHey @CodePapa360 Thank you for your helpful suggestion, and I'm really sorry for the multiple selectors; it's one of my bad habits to align an element first, then add typography, color, background, etc. anyway thanks a lot.
0
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