columns CSS

Универсальное свойство columns позволяет одновременно задать ширину и количество колонок многоколоночного текста.

Значение по умолчанию:

auto

Наследуется:
Нет
Применяется:

К блочным элементам (кроме таблиц), ячейкам и элементам, у которых display установлен как inline-block

Анимируется:
Да
Объект JavaScript:

object.style.columns

Спецификации:
Поддержка браузерами:

Can I Use multicolumn? Data on support for the multicolumn feature across the major browsers from caniuse.com.

Синтаксис

/* Column width */
columns: 1em;

/* Column count */
columns: auto;
columns: 1;

/* Combination of column width and count */
columns: 1 auto;
columns: auto 12em;
columns: auto auto;

/* Global values */
columns: inherit;
columns: initial;
columns: unset;

Значения

Комбинация свойств column-width и column-count. Порядок значения не имеет.

Примечание

Firefox поддерживает свойство -moz-columns.

Safari, Chrome и Android поддерживают свойство -webkit-columns.

Примеры

Ширина колонок 200 пикселов, количество задаётся браузером.

columns: 200px auto;

Три колонки минимальной ширины 12em каждая.

columns: 3 12em;

Две колонки, их ширина определяется браузером.

columns: 2;