Orvis: portfolio page layout broken with Jetpack lazy-images active

[KokkieH]

Steps to replicate

1. On a self-hosted site, create a static front page set to the portfolio page template
2. Publish some portfolio projects with featured images
3. Go to My Site ->Settings ->Performance, and turn Lazy load images off
4. View the site's front page.
5. Turn Lazy load images on
6. View the front page (might need to refresh a few times to trigger the bug)

Result

The layout breaks, with either image thumbnails overlapping each other, or else additional spacing being added between images:

First screen shot from Firefox, second one from Chrome

Expected

For the front page to look the same as with Lazy load images off

• User report: https://wordpress.org/support/topic/portfolio-images-overlapping-2/

[RealCarFax]

Have another user report of this with a site hosted on WordPress.com. Turning off Jetpack Lazy Loading for images did work.

12759521-hc

[KokkieH]

I've come across this on a WordPress.com simple site now in https://wordpress.com/forums/topic/orvis-theme-help-3/

There's no option to turn off lazy loading on simple sites.

[fresatomica]

Another report of this on a simple WordPress.com site: https://wordpress.com/forums/topic/portfolio-grid-overlapping-on-the-website-load/

[carinapilar]

Another report for WordPress.com Simple sites on 3941894-zd-woothemes.

[AlexanderMonsanto]

Another report for WP.com Simple - 4260114-zd

[jordesign]

I'm currently unable to reproduce this in testing - but it does make sense that the build-in Masonry system might have troubles when not all images are loaded (due to Lazy Loading).

For impact - Orvis is installed on 193,576 sites.

[devNigel]

Another report for an AT site: 4662336-zen