Релевантные источники: - developer.mozilla.org -> [flex-basis](https://developer.mozilla.org/ru/docs/Web/CSS/flex-basis) > Данное свойство прописывается [[flex container и flex items|flex-элементу]] `flex-basis` - это свойство CSS, которое определяет начальный основной размер (main size) [[flex container и flex items|flex-элемента]] до распределения свободного пространства. Основной размер может быть шириной или высотой в зависимости от [[flex-direction]]. ### Значения свойства - `auto`: (значение по умолчанию) Размер элемента определяется его содержимым, свойствами `width` или `height` (в зависимости от flex-направления). - `<длина>`: Специфическое значение, которое может быть выражено в единицах длины, таких как пиксели (`px`), проценты (`%`), и так далее. Определяет фиксированный размер элемента. - `content`: Автоматический задаёт размер на основе содержимого элемента flex. - `initial`: Устанавливает значение свойства в его значение по умолчанию (`auto`). - `inherit`: Элемент наследует значение свойства от своего родителя. ### Синтаксис ```css .child { flex-basis: 100px; } ``` ### Интерактивная визуализация <iframe src="https://interactive-examples.mdn.mozilla.net/pages/css/flex-basis.html" width="100%" height="380px"></iframe>