Our issue was Google continually reporting: Content wider than screen.

Our image was correctly sized (700 pixels wide) and configured in CSS to be mobile responsive:

img {
max-width: 100%;
display: block;
}

But Google was having none of it.

Then we noticed something.. the offending image had no borders and a considerable amount of white space.  So.. (genius), we simply created a new image (same size – 700 pixels wide), but with a light gray, one pixel border around it. and guess what.. Google reported it the following day as FIXED!  Thanks Gman!

Without Border

With Border

Content wider than screen

Horizontal scrolling is necessary to see words and images on the page. This happens when pages use absolute values in CSS declarations, or use images designed to look best at a specific browser width (such as 980px).

To fix: Make sure that the page uses relative width and position values for CSS elements, and make sure images can scale as well. Read more in Size Content to Viewport.

Questions

Why does google continue to report an image as content wide than screen when it isn’t

Mobile Usability issues detected

Content wider than screen