css властивість columns

Властивість columns - універсальна властивість, яка дозволяє одночасно задати ширину і кількість колонок многоколоночного тексту.

Властивість columns - універсальна властивість і дозволяє одночасно задати значення для наступних css властивостей:

• column-width
• column-count

Зауважте, що порядок значень дуже важливий. Ви повинні вказати значення в тому ж порядку, як вказано в розділі синтаксису нижче.

правити

+ додати пораду чи нотатку

Синтаксис

columns: auto|column-width column-count|initial|inherit;

Властивість columns може отримувати 5 значень:

auto

Значення без задання. Встановлює значення auto для column-width та column-count

автор: Svitlana

правити

column-width

Встановлює ширину стовпців

автор: Svitlana

правити

column-count

Встановлює кількість стовпців

автор: Svitlana

правити

initial

Встановлює властивість у значення без задання

автор: Svitlana

правити

inherit

Вказує на спадковість властивості від свого батьківського елемента.

автор: Svitlana

правити

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
columns	1.0 -webkit-	9.0 -moz-	3.0 -webkit-	11.1	12.0	10.0

Підтримка: мобільні переглядачі

Переглядач
columns	1.0 -webkit-	1.0 -moz-	3.0 -webkit-

Приклади

+ запропонувати свій приклад у пісочниці

<div class="cols">Багатоколонкова верстка ділить текст автоматично: браузер сам вирішує, де перервати рядок і почати нову колонку. Що довший текст, то краще видно поділ — тому цей абзац навмисно багатослівний і ще й трохи повторюється, щоб колонкам було чим заповнитися.</div>

.cols {
    columns: auto 12em;
}