Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Request path contains unescaped characters
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

@MichalKarczewicz

Desktop design screenshot for the NFT preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hello there,

I just finished my third challenge. I want your suggestions what can be improved and in general what you like or you don't like. Thank you in advance for feedback :)

Community feedback

Agnik Bakshiโ€ข 480

@Agnik7

Posted

Hi, Congratulations on solving this challenge!!!๐ŸŽ‰๐ŸŽ‰๐ŸŽ‰๐ŸŽ‰ I just went through your code, and have a few suggestions that I feel will help you.

  • Replace the h3 tag with an h1 tag to get rid of the accessibility issue.

  • In the CSS file, you don't have to mention width:100% to the body tag, because, for any element, if width is not mentioned, it takes up a 100% of its width by default.

  • In the body tag, replace the height:100vh with min-height:100vh, for better responsiveness.

  • For the p tag inside the div class="value" tag, instead of using font-weight, you can use the <b></b> to make the text bold, thereby requiring one less CSS line. <p><b>0.041 ETH</b></p>

Hope this comment helps you. Please feel free to correct me if I said anything incorrect. Have a nice day!!

Marked as helpful

2

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