search

DrewDahlman / Mason

Mason.js for creating a perfect grid with jQuery.
http://masonjs.com/
MIT License
1.22k stars 184 forks source link

Items left-aligned and a ton of fillers #66

Open jwleon opened 8 years ago

jwleon commented 8 years ago

Hello! This plugin looks by far the most promising one when it comes to masonry galleries. Thanks for development!

Nonehteless, I came across a problem that I was not able to fix:

All my grid-items are left-aligned in the 6-column grid (sizing is working: 1x1, 2x1, 1x2, ...) and all the slots to the right of it are filled with my filler-elements. This results in way too long list and tons of fillers:

image

Any idea what is causing this issue? Thanks in advance and best regards.

jwleon commented 8 years ago

I oversaw that I had to add "float: left" to the item-class - I thought the plugin would do it for me. So I got it working now, except for one strange thing: The last column is always only filled with fillers:

image

Since my image-sizes are generated randomly and I reloaded the page a dozens of time, I can be pretty sure that it is not by chance kept empty. And logically there would be no reason either since there are usually some 1x1 and 1x2 blocks that could easily go there...

DrewDahlman commented 8 years ago

could you put together a codepen of fiddle? Looks like the sizing being used for blocks is forcing it into the columns that you see. if there was a 2 wide vs 1 wide anywhere in there it will change that layout quite a bit.

delicatesther commented 7 years ago

Hi! Is there some solution to this by any chance? I'm running into the same issue. The current grid is way too tall due to all the additional fillers (that seem unnecessary). I made a pen, you can check it out here.