Hello,
In Responsive images section, under subsection of How to create responsive images? > Resolution switching example, elva-fairy-480w.jpgis not showing up at all, no matter the veiwport width. I googled a bit and found out that slot allotted in sizes attribute gets multiplied by device pixel ratio. That was the reason behind only elva-fairy-800w.jpg loading everytime because my device-pixel ratio is more than 1. The article assumes the device-pixel ratio of 1 right? Am I the only one having this problem? If not, can you guys clarify it? (I’m using Firefox v78.0.2 browser)
Hello @VarunK
could you please share the full code
for me it work fine and i use the same version also
have a nice day
This example code, which was given as example for Resolution switching: Different sizes under How do you create responive images sub-section. I appreciate the help you too have a nice day 
Hello @VarunK
for me it work fine both size load when i resize my window
-
did you tried to resize your window even if what you said is the cause of the issue it still should be change if you resize your screen smaller
-
try to disable all your plugin and see if it work
3 try to use another browser
hope that help and have a nice day
1 Like
This is similar to a recently opened mdn issue.
I think it’s worth to add to the documentation about how DPR affects the calculations.
1 Like
Yes I tried resizing the viewport width to the smallest(Around 450px wide), still it gave 800w image. Also tried in Edge browser still same result. Going to Responsive design mode and setting the DPR to 1 as suggested by @aviv.mu in github thread seemed to work and loaded correct images. Thank you @aviv.mu and @justsomeone for the help.
you welcome