column-width
Свойство CSS column-width используется для указания рекомендуемой ширины колонок (столбцов) в многоколоночном элементе. Если содержимое какой-то колонки не будет помещаться в ее строку (например, большое изображение), то ширина будет увеличена. И наоборот, браузер уменьшит ширину колонок, если они не будут входить по ширине в размеры элемента.
Вместо column-width можно применять универсальное свойство columns.
Тип свойства
Назначение: форматирование.
Применяется: к незамещаемым элементам уровня блока (кроме <TABLE> и элементов с display: table). К ячейкам таблиц — <TD>, <TH> и элементам с display: table-cell. А также к встроенным блокам — display: inline-block.
Наследуется: нет.
Значения
Значением свойства column-width является указание ширины колонок одним из следующих вариантов.
Процентная запись: не существует.
Значение по умолчанию: auto.
Синтаксис
Пример CSS: использование column-width
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "https://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>seodon.ru - CSS свойство column-width</title>
<style type="text/css">
body {
column-count: 3; /* рекомендуемое количество колонок */
column-width: 200px; /* рекомендуемая ширина колонок */
}
</style>
</head>
<body>
<p>Lorem ipsum dolor sit amet consectetuer ligula pede fermentum volutpat nisl. Id velit
eu Morbi dolor felis et nulla et tincidunt hendrerit. Ridiculus ridiculus et eros orci
Morbi Nunc sollicitudin nibh pellentesque nibh. Nunc Aliquam nec justo auctor eget eget
Nam Nunc orci Phasellus. Vivamus nibh Integer interdum consectetuer vel interdum elit.</p>
</body>
</html>
Версии CSS
Версия: | CSS 1 | CSS 2 | CSS 2.1 | CSS 3 |
Поддержка: | Нет | Нет | Нет | Да |
Браузеры
Браузер: | Internet Explorer | Google Chrome | Mozilla Firefox | Opera | Safari | |
Версия: | 6.0 и выше | 2.0 и выше | 2.0 и выше | До 11.1 | 11.1 и выше | 3.1 и выше |
Поддержка: | Нет | Нет | Нет | Нет | Да | Нет |