Почему не срабатывает Masonry?

Question

[Филипп Гаврилов]

Делаю плитку из блоков при помощи скрипта Masonry.

Есть блоки квадратные .item и есть большие прямоугольные .item_w2

Если большой блок поставить первым, скрипт срабатывает некорректно - будто у всех дивов слетает float.

https://jsfiddle.net/L19dpj8g/2/

Ставлю большой блок вторым и далее - всё ок.

В чем дело?

Answer 1

[Алексей Зуев]

А причем тут float? Masonry на абсолютах строит сетку.
Дело в том, что логика вычисления позиций в masonry отталкивается от свойства columnWidth.
Вы его проставили так:
columnWidth: ".item"
Будет получен элемент по этому селектору https://github.com/desandro/masonry/blob/master/di...
Это вернет ваш большой прямоугольник и у него возьмется outerWidth свойство. Теперь вся сетка будет зависеть от этого свойства.
Попробуйте сделать небольшой обход этого через вот такой хак:
columnWidth: ".item:not(.item_w2)"
Пример

Comments

[Филипп Гаврилов]

про float была просто аналогия, чтобы описать происходящее
спасибо!

Answer 2

[Aslan]

В точках )))))

Comments

[Филипп Гаврилов]

поясните, не понимаю