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 preview card with desktop and mobile version using flex box

Nomy 130

@Nomylim

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?

This is my first time using flexbox. I think I managed to create something that meets the challenge requirements.

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

I'm still struggling a little bit with the various flexbox properties, but I believe I'm starting to get the hand of it.

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

However, I'm not entirely satisfied with the transition between a large desktop screen and a small mobile screen. Does anyone have any advice on this?

Community feedback

P

@rafaeldgeo

Posted

Hi @Nomylim It's normal we have difficult with flexbox! I saw the images are link broken. You can use point "." before the slash srcset="./images/image-product-mobile.jpg". It's happening because the images are another folder.

Marked as helpful

0
yesim 170

@ysmltr

Posted

hey nomy love your work, but I couldn't see photo of perfume maybe u want to fix? good job and best regards!

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