search

eiriklv / react-masonry-component

A React.js component for using @desandro's Masonry
MIT License
1.43k stars 145 forks source link

StrictMode breaks Masonry #183

Open solarlime opened 9 months ago

solarlime commented 9 months ago

Hello, everyone!

I tried to use 'react-masonry-component' but found very strange behaviour (as for me). Wrapping with <React.StrictMode> breaks masonry - it does not set any positioning.

Layout with and without StrictMode: With StrictMode Without StrictMode

Inline styles with and without StrictMode:

With StrictMode Without StrictMode

It can be fixed by adding { position: relative } to a parent and { position: absolute } to children, but it's a dirty fix: also masonry stops rebuilding on resize, you need to trigger the layout function. Any ideas?

Reproduced in Codesandbox

hussain-nz commented 6 months ago

Thanks for helping us fix our issue too! We upgraded to React 18 and got the same issue. Using "position: relative" on the parent's "style" property didn't work. It worked when using a class in className (in our case, tailwind "relative").