0

Chrome 46 on my desktop loads the right images when i resize the browser to different widths. However on my phone it loads the largest image! the 1024w one. When i go to http://html5test.com/ on my phone it says its supported. Can anyone confirm that it's just not working correctly on mobile? 

<img src="https://c1.staticflickr.com/1/667/22803832666_5142663029.jpg" srcset="https://c2.staticflickr.com/6/5642/22373891881_0508995dc9_b.jpg 1024w, https://c2.staticflickr.com/6/5642/22373891881_0508995dc9_c.jpg 800w, https://c2.staticflickr.com/6/5642/22373891881_0508995dc9_z.jpg  640w,https://c2.staticflickr.com/6/5642/22373891881_0508995dc9.jpg 500w" sizes="80vw" />
Turnip
  • 35,836
  • 15
  • 89
  • 111
neptunian
  • 410
  • 4
  • 17

1 Answers1

0

Your S6 has a device width of 360 pixels.

Its display has a super-high pixel density of 4x, so a total amount of 4 * 360 = 1440 physical pixels width in portrait orientation. (4 * 640 = 2560 in landscape)

80% of that, as specified in your sizes attribute, is 1152 physical pixels wide, so the your browser is correct in trying to get the largest image you have for that space on such a high-ppi screen.

I hope this helps!

Sephie
  • 331
  • 1
  • 3
  • 15