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 CSS3's Grid & Flex

#accessibility

@0xabdulkhalid

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 everyone..👨‍💻

  • This was an excellent challenge to train and improve my knowledge with grid & flex layout.
  • This helps me to practice about turning designs into actual website
  • I tried to make my code as clean and readable as possible! If there's anything I can improve on this, I'd love to know!

Feel free to leave comments on how I can improve my code.

Peace be upon you..✨

Community feedback

Hassia Issah 50,830

@Hassiai

Posted

Increase the width of .container to get the desire width in the design. for mor responsive width use max-width instead of width. There is no need for height value in .container the padding value is sufficient.

Use rem or em as unit for the padding , margin, width and preferably rem for the font-size for more css units this watch this https://youtu.be/N5wpD9Ov_To

Hope am helpful

Well done for completing this challenge,

1

@0xabdulkhalid

Posted

Dear @Hassiai,

  • The link you shared was very usefull to understand
  • Thanks for your feedback regarding this solution
0
Hassia Issah 50,830

@Hassiai

Posted

@0xAbdulKhalid, if you find my comment helpful mark it 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