flex-growИмовина је под-својство Флексибилна кутија Лаиоут модула.
Дефинише способност да флексибилни предмет расте ако је потребно. Прихвата јединствену вредност која служи као пропорција. Диктира количину расположивог простора унутар флекс контејнера који би ставка требало да заузме.
На пример, ако су сви предмети flex-growпостављени на 1, свако дете ће поставити једнаку величину унутар контејнера. Ако бисте неком од деце дали вредност 2, то дете би заузело двоструко више простора од осталих.
Синтакса
flex-grow: .flex-item ( flex-grow: 2; )Демо
Следећа демонстрација показује како се израчунава преостали простор према различитим вредностима flex-grow(за боље разумевање погледајте ЦодеПен).
Све ставке имају flex-growвредност 1, осим треће која има flex-growвредност 2. То значи да ће, када се расположиви простор распореди, трећа флексибилна ставка имати двоструко више простора од осталих.
Подршка прегледача
- (модерно) значи недавну синтаксу из спецификације (нпр.
display: flex;) - (хибрид) значи чудну незваничну синтаксу из 2011. године (нпр.
display: flexbox;) - (стара) значи стара синтакса из 2009. године (нпр.
display: box;)
| Хром | Сафари | Фирефок | Опера | ИЕ | Андроид | иОС |
|---|---|---|---|---|---|---|
| 21+ (модерно) 20- (старо) | 3,1+ (старо) | 2-21 (стари) 22+ (нови) | 12,1+ (модерно) | 10+ (хибридно) | 2,1+ (старо) | 3,2+ (стара) |
Прегледач Блацкберри 10+ подржава нову синтаксу.
За више информација о томе како мешати синтаксе како бисте добили најбољу подршку за прегледач, погледајте овај чланак (ЦСС-трикови) или овај чланак (ДевОпера).