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 component using html and CSS grid

#styled-components#materialize-css

@TosinAyedun

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 still don't know how to use and style media queries properly. Pretty sure I messed up my code a bit with that.

I will appreciate any assistance with it.

Community feedback

Haybuka Paschal• 670

@Haybuka

Posted

Hi.. Maybe take a look at this tutorial, they sure did help me CSS : https://www.youtube.com/watch?v=I9XRrlOOazo&list=PL4cUxeGkcC9gQeDH6xYhmO-db2mhoTSrT CSS-POSITION : https://www.youtube.com/playlist?list=PL4cUxeGkcC9hudKGi5o5UiWuTAGbxiLTh CSS-FLEXBOS : https://www.youtube.com/watch?v=Y8zMYaD1bz0&list=PL4cUxeGkcC9i3FXJSUfmsNOx8E7u6UuhG

Good job, keep it up.

Marked as helpful

0
Hexer• 3,680

@Phalcin

Posted

  • Great work, In these instances i wouldn't recommend you to use media queries because the design can be responsive on their own in these cases.

  • I think if you want to know more about media queries you should search on youtube and watch some tutorials about them.

  • Also use rems instead of px this also helps in responsiveness.

I hope this helps. You can also check out my solution to see how i did it.

Marked as helpful

0

@TosinAyedun

Posted

@Phalcin yes, these tips are helpful.

I literally went into this with no prior knowledge. I studied English Language at Uni, lol. I'm barely 3 months into learning about frontend. Every tip is helpful. Thank you.

0
Hexer• 3,680

@Phalcin

Posted

@TosinAyedun Same here buh i've not gone to uni yet. I completed senior high last year and i began learning programming in January. I spend a lot of hours doing it since i'm home.

0

@TosinAyedun

Posted

@Phalcin That's nice.

Sometimes, I wish I had started early. I'm a bit jealous. lol

0
Hexer• 3,680

@Phalcin

Posted

@TosinAyedun lol, you will get there soon enough. Just stay consistent.

0
Abdul• 8,560

@Samadeen

Posted

Hey!! Cheers 🥂 on completing this challenge.. . Here are my suggestions 1.You should use <main class="container"> instead of <div class="container">. 2. Go down orderly when you are using the headings h1 down to h2 down to h3 and so on. 3.You should use the broiler plate provided to you it saves alot of stress 4. Your HTML should have the Language attribute. 5. Your Image should have an alt text for screen readers.

. Regardless you did amazing.. Happy coding!!!

Marked as helpful

0

@TosinAyedun

Posted

Hi @Samadeen Thanks for feedback. I will make the corrections. Thank you!!

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