1

I am trying tow switch between different versions of same image with srcset, but in Chrome is not working. In Firefox is ok. Ater clearing the cache the result is the same

img {
  max-width: 100%;
}
<div style="max-width: 1170px; margin: 0 auto;">
    <img src="https://i.imgur.com/FOkWyOu.jpg"
         srcset="https://i.imgur.com/FOkWyOu.jpg 400w,
                 https://i.imgur.com/OXha4kY.jpg 767w">
</div>
alexanderstanchev
  • 75
  • 2
  • 11
  • Have you used developer tools and the network tab to see which image is used? I copied your code to codepen.io and the other image loaded when the screen got smaller. But you should also add the media queries: https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images#Resolution_switching_Different_sizes – andeersg Feb 21 '18 at 11:57
  • In the Network tab when I am on smaller screen and refresh, the small image is loaded, but it is not visible in browser. – alexanderstanchev Feb 21 '18 at 12:07
  • Related - https://stackoverflow.com/questions/28650327/responsive-images-srcset-not-working – Paulie_D Feb 21 '18 at 12:18

0 Answers0