Skip to content
Submitted over 1 year ago

Responsive Product design using flexbox

Muzammil Hussain•150
@MuzammilHuxain
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

Having difficulty while adjusting the size of image. Image was not fitting accordind to the height of div.

One more problem is, when i set with 1440px, scroll at the bottom gets appear.

Anyone comments will be appreciated

Community feedback

  • Gabriel Lira•170
    @gabrieltrtPosted over 1 year ago

    Hey friend, how are you? Congratulations! you're almost done. To improve the image in this challenge, you must use the <picture> tag. Basically this tag stipulates minimum sizes where the image is changed by another.

    In this challenge you have two images, one for the mobile version and one for the desktop version.

    Marked as helpful
    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