Тег column-width в CSS: опис, синтаксис та приклад
Кратка інформація
| Значення за замовчуванням | auto |
|---|---|
| Наслідується | Ні |
| Застосовується | До блочних елементів (крім таблиць), клітинок та елементів з властивістю display встановленою як inline-block |
| Відсотковий запис | Не застосовується |
Версії CSS
| CSS 1 | CSS 2 | CSS 2.1 | CSS 3 |
|---|---|---|---|
Опис
Встановлює оптимальну ширину колонки в багатоколоночному тексті. Реальна ширина колонки може бути більшою, ніж введене значення, скорочення вказаної ширини веде до скасування кількох колонок, текст при цьому вирівнюється в одну колонку.
Синтаксис
column-width: <значення> | auto
Значення
- <значення>
- Значення ширини колонки в абсолютних одиницях CSS (наприклад, пікселів).
- auto
- Ширина колонок обчислюється автоматично на основі інших властивостей (column-count, column-gap).
Приклад
HTML5CSS3IE 9CrOpSaFx
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>column-width</title>
<style>
.book {
-moz-column-count: 3;
-moz-column-width: 200px;
-webkit-column-count: 3;
-webkit-column-width: 200px;
column-count: 3;
column-width: 200px;
}
</style>
</head>
<body>
<div class="book">
Как было показано выше, кризис жанра дает звукоряд, и здесь в
качестве модуса конструктивных элементов используется ряд
каких-либо единых длительностей. Фьюжн, по определению, полифигурно
варьирует гармонический интервал, и если в одних голосах или пластах
музыкальной ткани сочинения еще продолжаются конструктивно-композиционные
процессы предыдущей части, то в других — происходит становление новых.
Трехчастная фактурная форма, в первом приближении, возможна. Форшлаг
изящно продолжает хамбакер, и если в одних голосах или пластах
музыкальной ткани сочинения еще продолжаются конструктивно-композиционные
процессы предыдущей части, то в других — происходит становление новых.
</div>
</body>
</html>Браузери
Firefox підтримує нестандартну властивість -moz-column-width.
Safari, Chrome і iOS підтримують нестандартну властивість -webkit-column-width.