search

paulcollett / react-masonry-css

React Masonry layout component powered by CSS, dependancy free
https://paulcollett.github.io/react-masonry-css/demo/
MIT License
959 stars 66 forks source link

very different columns height #73

Open alainib opened 3 years ago

alainib commented 3 years ago

hello. I'm trying this package, i get very different columns height because i display items with very different height. Some have title + little texte , some have long image more.

Capture d’écran 2021-04-20 à 22 24 42

Is there a way to fix this ?

I found a fix for now, sorting items with images first, but not sur it's a good idea because date is displayed

Thanks

yechs commented 3 years ago

Yeah I had just the same problem and I think it is the intended behavior (at least for now).

The authors comments in https://github.com/paulcollett/react-masonry-css/issues/64#issuecomment-695862802 that

I'm aware of this behaviour and it's occurring because we don't actually handle this case, but i'm open to revisiting.

To implement it's slight performance trade off, as we need to calculate all the item heights and adjust the layout again, then again after each image has loaded. So for this plugin, avoiding all these re-layouts was actually the motivation behind making this plugin originally.. to be a fast and performant foremost.