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

Product Card Component (Mobile First Design)

P
Eric Tan 70

@erict16

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


This project is a really good practice for beginners. I learned using flexbox and responsive design. However, I am not for sure my css code is clean or not. Welcome feedbacks!

Community feedback

JimTK16 370

@JimTK16

Posted

Nicely done Eric.

I'm a beginner too, so take my words with a grain of salt :). I think in general we should avoid setting a fixed width for image or element. Instead, for the container you could set a max-width, and for the image you could set width: 100% so it take the full width of its parent.

Jim

Marked as helpful

1

P
Eric Tan 70

@erict16

Posted

@JimTK16 Thanks Jim!

1

@Call4julius

Posted

Nice code.

I think you are not relying on inheritance enough, hence, it makes you repeat yourself.

Also, why do you need TWO media queries?

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