Google mobile friendly tester cannot reproduce errors on device or Chrome

Question

I have a number of pages which are failing the Google mobile friendly tests.

When viewed in the Mobile friendly tester two errors are reported:

1. Clickable elements too close together
2. Content wider than screen

It is this second issue "Content wider than screen" I'm having a problem with. If you inspect the page in Google Chrome -> Choose Google Pixel device, the content is scaled correctly to fit the viewport (411 pixels)

I cannot find a single element of the page which is wider than the viewport.

Another testing tool here reports the actual error, which says:

The page content is too wide for the viewport, forcing the user to scroll horizontally. Size the page content to the viewport to provide a better user experience. The page content is 1,092 CSS pixels wide, but the viewport is only 412 CSS pixels wide.

Again I can't find which element(s) on the page are greater than 412 pixels wide.

Could this be a false positive?

Or could it be a latency issue? What if my server isn't serving CSS fast enough for the mobile tester?

Any help appreciated.

Answer 1

This problem was resolved and was not a CSS issue or page layout issue, but a caching plugin AutoOptimize was combining Javascript and causing some scripts to run too late for the mobile tester to see the result.

So it was a false positive but resolved by tweaking caching settings.