Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

NFT preview card using css

nati 200

@nati-pi

Desktop design screenshot for the NFT preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

@AlazarG19

Posted

nice job just increase the scale and try changing the color of the line

Marked as helpful

0
Travolgi 🍕 31,400

@denielden

Posted

Hi Nati, good job! I took some time to look at your code and have some ideas for improving it:

  • add main tag and wrap the card for improve the Accessibility
  • add descriptive text in the alt attribute of the image
  • to make it look as close to the design as possible change the color of hr
  • use a tag instead span for name of author
  • remove all margin from cont class because with flex they are superfluous
  • add a little transition on the element with hover effect
  • instead of using px try to use relative units of measurement -> read here
  • using <hr> for the line is not the best way because this tag have a semantic meaning... in this case use div with border-bottom because this line is decorative

Overall you did well 😉

Hope this help and happy coding!

Marked as helpful

0

Please log in to post a comment

Log in with GitHub
Discord logo

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