Windows Phone 8图像比视口更宽

Question

I've been trying to solve an issue that only happens on Windows phone 8. They use as a browser IE10. In many responsive design projects I've checked that all the mobile phones work correctly except this mobile phone and it's browser.

The issue

The images are bigger than the viewport itself making the image overflow by the right side of the screen. This overflow creates an uncomfortable scrolling in it's x-axis.

Possible solutions which did not work for me

Matt stow solution

CSS tricks solution

I'm testing with a nokia lumia 925 and a nokia lumia 520. If I apply this solution they both have different layouts. Especially the nkia 925 as it has a big resolution the media queries act strangely, as it was a tablet.

Does anybody have a clear and working solution which does not break other devices layout?

Answer 1

Just yesterday i had the same Problem and yes i visited the same pages like you. I just added an

.im_the_parent_class_of_the_image {
   overflow:hidden
 }

to the parent class/element of the image and it still works fine for me and no other browser was affected.