Masonry Views: appears as 1 column

I am also having this problem. @fbreckx, does this gallery wrap perfectly in the View's preview option? for sure, the live view page does not set a "masonry-layout" css class, but even when I add it to the View's css class setting, Masonry is never initialized on the masonry-items.

i haven't found a solution, but have tried every combination of settings and it seems to be a bug or conflict with our theme?

Same problem - just a single column. Any ideas here? Thanks...

Hi !
What about playing with the CSS ? Is it a sizing issue ? A display: block issue ? Is the masonry js loaded on the page ? Do you have console errors ?

Thank you for the quick response - most encouraging! I won't be able to look further into this until later today, but I wanted to reach out soonest to thank you for the timely response. Hit you back a little later and again, thanks... looking forward!

OK - I was able to get things working by using a combination of settings and some CSS.

Settings:

Add views row classes and striping
Column width units: Pixels
Resizable
Animated
Gutter width: 3px
Resizable and Animated: checked
Fit width, RTL layout, Load images first and Percent position: unchecked.

Here's the CSS:

@media screen and (min-width: 400px) and (max-width: 547px) {
.masonry-item {
width: 46%;
}
}

@media screen and (max-width: 399px) {
.masonry-item {
width: 100%;
}
}

Hope this helps someone… thanks!

Thanks @bcobin for sharing !

Hmmm, I'm not sure about "works as designed"... The options given in the UI suggest that we should be able to set up a working masonry system from there. I don't mind using css instead – gonna test in a minute if this solves my troubles as well – but I've been googling, testing, giving up and restarting way too long before ending up here!

It'd be nice if the css requirement was clear from the outset. Call it a feature request, if you will ;)

My masonry view also was stuck in one column (with each row on top of the other, actually). Until I read comment #19 in issue 3288460 that told me the gutter width should not contain the px affix.

I'm just leaving this here in case anyone else runs aground like nmillin and I did.

Thanks @zJoriz for your feedback.

Let me reopen: I guess I can provide an extra option for default CSS to help the site builders get the columns working more easily.
Also what can I do to improve the situation with gutter field ? Should I make it more tolerant to support the affix (I can trim it automatically for instance).

Note: I change this issue to 8.x, but this will be 2.x in the new release versioning system. Just saying that I won't support 7.x dev I guess.

Should be fixed by the usage of 4.x, which should therefore simplify that.