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

Responsive product preview card component

@luqmanx1998

Desktop design screenshot for the Product preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

My first challenge on Frontend Mentor !

I'm proud of taking the time to make it look as close to the design as possible, without using the figma file. If I were to do something differently next time, I would probably spend less time trying to get the perfect spacing sizes as it's probably impractical to spend hours trying to make it look perfect. That being said , I would love some kind of code review by anybody to help me improve my code :D. On to the next one.

What challenges did you encounter, and how did you overcome them?

I actually had issues with responsive images, but I managed to fix those by reading up on mdn web docs.

What specific areas of your project would you like help with?

Any kind of code review and feedback at all would be appreciated. Although for such a small project such as this one, I'm not surprised if no one takes a look haha !

Community feedback

@DylandeBruijn

Posted

@luqmanx1998

Hiya! 👋

Congratulations on your solution, it looks very close to the design! I can tell you put a lot of effort into it.

Things I like about your solution 🎉

  • Use of semantic HTML elements
  • Clear descriptive CSS classes
  • Use of CSS custom properties
  • Use of relative CSS units
  • BEM
  • Use of the picture element

Things you could improve ✍️

  • I suggest using a p tag for the header.

I hope you find my feedback helpful! 🌟

Let me know if you have more questions and I'll do my best to answer them. 🙋‍♂️

Happy coding! 😎

Marked as helpful

1

@luqmanx1998

Posted

@DylandeBruijn Thank you squire! Really appreciate you ! I guess someone did take a look after all haha (I was joking on that last line :p). Hope we can connect or something sometime ! I didn't expect to hear back from someone so soon, I feel extra motivated now so thanks :D

1

@DylandeBruijn

Posted

@luqmanx1998

Glad you feel extra motivated! I'll follow you ;)

1

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