vue-masonry-css
vue-masonry-css copied to clipboard
elements with different height
Hello,
I have created something same for one of my project, I was checking your repo. and by seeing your code I found that it will not work if elements have different height because we are counting elements in each column. Any plans to support variable heights?
If I follow correctly, smart sorting based on height, to display as close to the original order would be a great feature for long varied lists of elements! Is that what your suggesting?
We do enter the territory of having to pre-render elements for height detection, so I'd be thinking this would be a nice optional feature, to keep our lean, performant behaviour as default.
Hi,
I applied on my portal and liked a results with elements have different height.
See on https://www.treinarfrontend.com/
@vitorleonel, looks like smart sorting based on heights would help you here too. It would help balance all the items and get rid of that long first column that I see. I'll look into this when I can
@vitorleonel, Looks pretty fine in your case, As per my previous short experience, it was causing the issue, Will check it again and prepare the fiddle if it's not working properly when I can.
Hi, @paulcollett Awesome work with this Vue Masonry Css. I am facing a similar issue. I have dynamic content with different height. Is there any way to balance the columns by height, instead of a number of elements in the column.
PS: I am still learning Web development and frontend technologies.
@paulcollett any updates on this? It would perfect to celebrate issue birthday with implement of it 😄
joining the party here - i really would appreciate a solution, with variable height items, since one columns always gets a lot longer than the other =)
Hello @paulcollett ,
Is it possible to order elements with column heights instead of the number of elements? Because some of the height of the column is much longer than the others.
Many Thanks
Yeah, this feature i think is quite essential for vertical masonry