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 FlexBox

@Rio1007

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


Hello guys, I have started web development one month ago and I would love if you can give me some advices on how to get better with my code. Thank you!

Community feedback

@CristianArielDelgado

Posted

GREAT JOB!

Insted of using px, try to code with relatives units like rem or em as unit for the padding, margin, width values and preferably rem for the font-size values. I will send you a link who help me a lots: click here

Keep working hard, believe in yourself!

1

@Rio1007

Posted

@CristianArielDelgado Really useful video. Thanks a lot!

0

@sarahsoaressilva

Posted

Hey! Good job!

I have an advice. You can use utility classes or custom props to reuse some part of your CSS code, like the "height: 500px" of img and #text-div or the "margin" values. This will make your CSS even better.

I will also send you a link of a video of Kevin Powell, his channel is amazing. Hope it can help you.

Link: Get more out of custom properties

Good coding!

0

@Rio1007

Posted

@sarahsoaressilva Hey, thanks a lot! I will look into it.

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