column-fill

Перейти к:
  1. Синтаксис
  2. Примеры
  3. Спецификации
  4. Поддержка браузерами

Перевод не завершен. Пожалуйста, помогите перевести эту статью с английского.

Свойство column-fill применяется к родительскому элементу, разбитому на столбцы и указывает как содержимое располагается внутри столбца (column). Если значение свойства column-fill установлено как balanced, то содержимое во всех столбцах будет иметь одинаковую высоту. В случае использования значения auto, содержимое занимает столько прострванства сколько ему потребуется.

Начальное значениеbalance
Применяется кмультиколоночные элементы
Наследуетсянет
Отображениеvisual, но в сплошной среде, не имеет никакого эффекта при переполнении колонок
Обработка значениякак указано
Animation typediscrete
Канонический порядокper grammar

Синтаксис

column-fill: auto;
column-fill: balance;

/* Значения по умолчанию */
column-fill: inherit;
column-fill: initial;
column-fill: unset;

Значения

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

Возможные значения

auto | balance | balance-all

Примеры

.content-box {
  column-count: 4;
  column-rule: 1px solid black;
  column-fill: balance;
  height: 200px;
}

Спецификации

Спецификация Статус Комментарий
CSS Multi-column Layout Module
Определение 'column-fill' в этой спецификации.		 Рабочий черновик Значение по умолчанию

Поддержка браузерами

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!
Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support (Да) 13.0 (13.0)-moz ? ? ?
Feature Android Android Webview Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile Chrome for Android
Basic support ? (Да) 13.0 (13.0)-moz ? ? ? (Да)

Метки документа и участники

Внесли вклад в эту страницу: fscholz, Sebastianz, Varinetz
Обновлялась последний раз: fscholz,