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

flex-flow CSS свойство, которое является сокращением для отдельных свойств flex-direction и flex-wrap.

/* flex-flow: <'flex-direction'> */
flex-flow: row;
flex-flow: row-reverse;
flex-flow: column;
flex-flow: column-reverse;

/* flex-flow: <'flex-wrap'> */
flex-flow: nowrap;
flex-flow: wrap;
flex-flow: wrap-reverse;

/* flex-flow: <'flex-direction'> and <'flex-wrap'> */
flex-flow: row nowrap;
flex-flow: column wrap;
flex-flow: column-reverse wrap-reverse;

/* Global values */
flex-flow: inherit;
flex-flow: initial;
flex-flow: unset;

Начальное значениекак и у каждого из подсвойств этого свойства:
Применяется кflex-контейнеры
Наследуетсянет
Отображениевизуальный
Обработка значениякак и у каждого из подсвойств этого свойства:
Animation typediscrete
Канонический порядокпорядок появления в формальной грамматике значений

Больше информации и свойств описано в Using CSS flexible boxes.

Синтаксис

Значения

Смотрите flex-direction и flex-wrap.

Формальный синтаксис

<'flex-direction'> || <'flex-wrap'>

Примеры

element { 
  /* Main-axis is the block direction with reversed main-start and main-end. Flex items are laid out in multiple lines */
  flex-flow: column-reverse wrap;            
}

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

Спецификация Статус Комментарий
CSS Flexible Box Layout Module
Определение 'flex-flow' в этой спецификации.
Кандидат в рекомендации Начальное значение

Совместимость с браузерами

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!

Возможность Firefox (Gecko) Chrome Edge Internet Explorer Opera Safari
Базовая поддержка 28.0[1] 21.0-webkit
29.0
(Да)-webkit
(Да)
11 12.10 6.1-webkit
Возможность Firefox Mobile (Gecko) Android Edge IE Phone Opera Mobile Safari Mobile
Базовая поддержка 28.0[1] ? (Да)-webkit
(Да)
11 12.10 7.1-webkit

[1] В дополенение к безпрефиксной поддержке, Gecko 48.0 (Firefox 48.0 / Thunderbird 48.0 / SeaMonkey 2.45) добавило поддержку для -webkit префиксной версии свойства для веб для веб совместимости, для тех кто не изменял значение своих настроек layout.css.prefixes.webkit,  по-умолчанию false. Поскольку Gecko 49.0 (Firefox 49.0 / Thunderbird 49.0 / SeaMonkey 2.46) предпочтительное значение по-умолчанию true.

Смотрите также

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

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