CSS свойство flex-basis

Свойство flex-basis задает базовую ширину флекс-элемента, относительно которой будет происходить растяжение (свойство flex-grow) или сужение (свойство flex-shrink) элемента. Похоже на свойства width и height, к которым добавляется содержимое элемента.

CSS синтаксис

flex-basis: ширина | auto | initial | inherit;

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

ЗначениеОписание
ширинаШирина элемента задается в px, %, em и других единицах измерения CSS.
autoЗначение по умолчанию. Элемент получает базовую ширину, соответствующую ширине контента внутри него, если она не задана явно.
inheritЗначение наследуется от родительского элемента.
initialУстанавливает значение по умолчанию.

Пример использования

Устанавливаем начальную ширину каждого второго флекс-элемента в 80px


div:nth-of-type(2) {
    -webkit-flex-basis: 80px; /* Safari 6.1+ */
    flex-basis: 80px;
}