UserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/62.0.3202.75 Safari/537.36

Steps to reproduce the problem:
1. Go to any site containing image, I used (http://theoatmeal.com/comics/universe_cat)
2. Turn on developer tools
3. Turn on device toolbar (Ctrl+Shift+M)
4. On the page, resize the page from the resolution panel to one step below the size of the image. In the example, (the chosen site), the size of image (the first one in comic strip, http://s3.amazonaws.com/theoatmeal-img/comics/universe_cat/1.png) is 653 x 653 (natural 651 x 651). Turning the resolution to anything below that, MobileL(425px), MobileM(375px), MobileS(320px). And then click the image again, and select inspect element, it still shows the same resolution 653 x 653 (natural 651 x 651). How can the image be still of same resolution, if the device that we are viewing in has lower resolution than the image WITHOUT having a horizontal scrollbar?

What is the expected behavior?
A) Either the image size reported should have been smaller.
B) OR, a horizontal scroll bar should have appeared at the bottom of the page.
None of this happened.

What went wrong?
As I explained in the steps to reproduce, the image shown was not reporting the correct image size when viewed in device mode below a resolution of the image.

Did this work before? No 

Chrome version: 62.0.3202.75  Channel: n/a
OS Version: 10.0
Flash Version: