Исправлен разрыв между столбцами CSS

Question

Я пытаюсь создать плавный контент, используя CSS-столбцы, но я сталкиваюсь с проблемой, когда промежутки между столбцами корректируются при горизонтальном изменении размера окна браузера.Есть ли способ исправить пробелы в колонках?Похоже, что свойство column-gap CSS позволяет вам установить минимальный пробел столбца, а при расширении области просмотра пропорционально увеличиваются пробелы.

Вот CSS, который у меня есть сейчас:

column-gap: 5px;
-moz-column-gap: 5px;
-webkit-column-gap: 5px;
column-width: 240px;
-moz-column-width: 240px;
-webkit-column-width: 240px;

и у меня внутри находятся div, которые имеют фиксированную ширину и имеют display: inline-block.

EDIT: Вот пример jsFiddle с соответствующим HTML / CSS: http://jsfiddle.net/4cqbr/1/. Я пытаюсь создать коллекцию постов с боковой прокруткой фиксированной ширины и переменной высоты.При изменении размера области «Результат» можно увидеть, что разрыв столбца увеличивается и сжимается.

Answer 1

Разрыв столбцов только изменяет размеры, потому что вы устанавливаете жесткую ширину столбцов.У вас не может быть плавной компоновки со всей жесткой настройкой ширины, что-то должно быть плавным.

Вот пример со столбцами жидкости и постоянными зазорами.