1

Пример на CodePen

Надо, чтобы 1-2-3-4 были в одном ряду, по размерам более, чем достаточно, но почему-то 2 и 3 переносятся на новую строчку. Этот пример брал из документации и менял код.

Размер контейнера 1170px

Мои стили:

.grid-item.height-50 {
    height: 200px; }
.grid-item.height-25 {
    height: 100px; }
.grid-item.width-25 {
    width: 250px; }
.grid-item.width-50 {
    width: 500px; }

JS:

var $grid = $('.masonry').masonry({
    stagger: 30,
    columnWidth: '.grid-sizer',
    itemSelector: '.grid-item'
});

$grid.on('click', '.grid-item.scale', function() {
    // change size of item via class
    $(this).toggleClass('grid-item--gigante');
    // trigger layout
    $grid.masonry();
});

В чем проблема?

Так же, 5-6-7-8-9 и 10-11-12-13-14 должны быть в двух рядах соответственно.

1 ответ 1

0

Использовал библиотеку packery.min.js с теми же стилями, все заработало так, как надо

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.