Эта статья нуждается в техническом обзоре. Как вы можете помочь.
Эта статья нуждается в редакционном обзоре. Как вы можете помочь.
Перевод не завершен. Пожалуйста, помогите перевести эту статью с английского.
Свойство column-fill применяется к родительскому элементу, разбитому на столбцы и указывает как содержимое располагается внутри столбца (column). Если значение свойства column-fill установлено как balanced, то содержимое во всех столбцах будет иметь одинаковую высоту. В случае использования значения auto, содержимое занимает столько прострванства сколько ему потребуется.
| Начальное значение | balance |
|---|---|
| Применяется к | мультиколоночные элементы |
| Наследуется | нет |
| Отображение | visual, но в сплошной среде, не имеет никакого эффекта при переполнении колонок |
| Обработка значения | как указано |
| Анимируемость | нет |
| Канонический порядок | уникальный не однозначный порядок, определённый формальной грамматикой |
Синтаксис
column-fill: auto; column-fill: balance; /* Значения по умолчанию */ column-fill: inherit; column-fill: initial; column-fill: unset;
Значения
auto- Высота столбцов не контролируется.
balance- Разделяет содержимое на равные по высоте столбцы.
Возможные значения
auto | balance
Примеры
.content-box {
column-count: 4;
column-rule: 1px solid black;
column-fill: balance;
height: 200px;
}
Спецификации
| Спецификация | Статус | Комментарий |
|---|---|---|
| CSS Multi-column Layout Module Определение 'column-fill' в этой спецификации. |
Кандидат в рекомендации | Значение по умолчанию |
Поддержка браузерами
| 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,