Issues with the masonry grid

The masonry grid seems to have become a bit glitchy recently. When you resize the window the elements overlap and don’t maintain the masonry grid. I disabled all the other CSS on my site and recorded this an example:

Some users are also reporting that the thumbnails are being squished where they are not maintaining the aspect ratio. I’ts a bit hard to tell, but many of these images are not displaying properly:


Thanks for reporting this! it appears to be an issue specific to Safari… we had some feature detection in the CSS for a browser-native masonry mode, and despite Safari not having this, it seems to think it does and it causes layout issues.

I’ve added some fixes here: FIX: remove CSS masonry @supports due to Safari issues by awesomerobot · Pull Request #28 · discourse/discourse-topic-thumbnails · GitHub

So updating the component should solve the overlap issues, and possibly the size issues as well (though let us know if those still persist)


That seems to have fixed both issues, thank you for the super quick fix Kris!