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_perfume_preview_card_component

yash-15-d 40

@yash-15-d

Desktop design screenshot for the Product preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

nirglus 270

@nirglus

Posted

Congratulations for completing this challenge! I have a few tips for you. Firstly, when you set a gap between items use vh for height / vw for width / px instead of rem, because em and rem are used for text size.

Secondly, for more semantic HTML try to use the <s> tag at the outlined price.

Thridly, at the PERFUME h4 try to use letter-spacing property to achive closer design.

And for last, try to add some transitions and on hover properties for the button so it will be more interactive and smoother for the user.

Keep up the good work :)

Marked as helpful

0

yash-15-d 40

@yash-15-d

Posted

@nirglus i didn't even noticed the gap in the word perfume. Thanks for pointing out this mistake.

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