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

Mobile-first Product preview card component

@Cosaldi

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 specific areas of your project would you like help with?

any feedback are welcome.

Community feedback

P
Steven Stroud• 4,100

@Stroudy

Posted

Around 575px to 630px your site starts to break and you can fix this by adding:

object-fit: cover;
    width: 100%;
    height: 100%;

to your .card__product-photo, Love the fact your using SCSS and BEM like me to but after some research SCSS is becoming more irrelevant because more and more features are coming to native CSS there were not there 10 years ago. Could be worth looking into it your self to form your own opinion, happy coding :D

0

@Cosaldi

Posted

@Stroudy yeah, i am still using it because for simplicity and easy to manage, and something that vanila css can't do.

by the way, thank for fix my code, i will apply it later.

Thanks....

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