Geek Answers Handbook

Vertical masonry filling in front of horizontal

I am building a grid of masonry, which should have the following output:

Idea for masonry grill.

But the problem is that the masonry first fills the horizontal space and then fills the vertical spacing. So, the first part is going well with the masonry, but the second part is not.

Paragraph 4 and paragraph 5 will be placed next to each other, and paragraph 6 will be established below.

The width of my container should be 100% and the objects should be fluid. Therefore, I use a percentage grid. I can’t stick fixed!

I have already tried the following:

http://output.jsbin.com/zojivodosu

As you can see in this jsbin the problem persists there. Anyway, can I fill the vertical space after that horizontal space too?

I do not want to customize my HTML, if possible. Thank you in advance.

Respectfully,

Wouter

+5
source share
1 answer

The final recommendation seems to be to use Freemasonry horizontally in an isotope (Isotope is commercial) - see https://github.com/desandro/masonry/issues/389

You can try using Freemasonry for the horizontal in the isotope. See http://isotope.metafizzy.co/demos/layout-modes.html and http://isotope.metafizzy.co/docs/layout-modes.html

The second link is the one currently working

There is a plug in there that does this - see https://github.com/desandro/masonry/pull/41 . This is from 2010, so it’s hard to say if he will break anything else.

+1
source

More articles:


All Articles