0

Всем привет! Подскажите, есть пару колонок с блоками с разным количеством ссылок внутри. Высота блоков выравнивается под высоту самого большего блока в строке. Как сделать, чтобы этого выравнивания не было(задавать фиксированную высоту не вариант, в дальнейшем количество ссылок может меняться)? Пробовала column-count, но тоже не вариант, у блоков есть кнопка ЕЩЕ, при нажатии открываются еще ссылки и происходит весь сдвиг колонок, что не нужно. Пример на картинках Сейчас так А нужно так [Верстка][3]

  [3]: https://jsfiddle.net/0j9vmhqt/7/
2
  • Это называется Pinterest Layout. Посмотри в инете, есть различные варианты. Но скажу сразу: если высота блока не фиксированная и зависит только от контента, то сделать такую сетку без JS вряд ли выйдет нормально.
    – Object417
    23 дек 2021 в 10:21
  • спасибо за информацию, думаю без скриптов то же ни как.
    – Yulya919
    27 дек 2021 в 10:20

1 ответ 1

0

тебе нужно css-свойство columns: 2 на родителе, а на ребенке break-inside: avoid;

вот код: https://jsfiddle.net/xu4afsqk/

3
  • Спасибо! Свойство columns уже применяла и при раскрытии вложенности в одном блоке все колонки начинают сдвигаться, что не очень удобно. Думаю без js не обойтись
    – Yulya919
    27 дек 2021 в 10:23
  • а у тебя c js колонки тоже будут сдвигаться. Можно как-то обсудить с дизайнером и раскрывающийся список делать абсолютом, поверх основного. Ну, если решишься все-таки на js, рассмотри еще masonry.desandro.com
    – VladykoD
    27 дек 2021 в 12:18
  • спасибо за информацию!
    – Yulya919
    27 дек 2021 в 12:27

Ваш ответ

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

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