Skip to content
Submitted 9 months ago

Product preview card with desktop and mobile version using flex box

Nomy•130
@Nomylim
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Product preview card component
  • HTML
  • CSS
1newbie

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

  • Rafael Dias•910
    @rafaeldgeoPosted 9 months ago

    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
    @ysmltrPosted 9 months ago

    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

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