product responsive

Community feedback

• 

  Humphrey Yeboah•150

  @hakylepremier

  Posted almost 2 years ago

  Okay so I think you found it difficult to do the responsive design because you used the same image for both desktop and mobile. There where two separate images so to achieve a responsive design you had to use a picture tag instead of the image tag you used.

  For example this:

  <img src="images/image-product-desktop.jpg" alt="">
  

  would replaced by this:

  <picture>
    <source media="(max-width:600px)" srcset="images/image-product-mobile.jpg"/>
    <img src="images/image-product-desktop.jpg" alt="" />
  </picture>
  

  You can find more information at this link.

  Hope this helps.

  00