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 card preview component using html and css

@Procodx

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


i have not done the mobile design of this project....please bear with me till next week.. other feedbacks are welcome.

Community feedback

@debriks

Posted

Hi Akinrinlola!

Just a small suggestion on your solution : it is best practice to create a separate style.css file to add the styles to your HTML document to keep things clear (even more important to function like that if you collaborate in a team).

To do that, you should create a style.css(you can actually call it the way you want but this is a convention) in the root folder (or in a css folder) and then link in the <head>of your html file like so: <link rel="stylesheet" href="/style.css" />

Also the fonts are not displaying correctly and this si because this line of code should be changed : ` font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Arial Rounded MT', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;``

to simply this: font-family: 'Outfit', sans-serif;

Hope you find this helpful.

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