flex-basis
Властивість є суб-властивість модуля Flexible Box Layout.
Він визначає початковий розмір гнучкого елемента, перш ніж будь-який доступний простір розподіляється відповідно до коефіцієнтів гнучкості. Якщо flex
його не вказати в скороченні, зазначеним значенням є нуль довжини.
Значення flex-basis, встановлене для auto
розмірів елемента відповідно до властивості його розміру (яке саме може бути ключовим словом auto
, яке визначає розмір елемента на основі його вмісту).
Синтаксис
flex-basis: .flex-item ( flex-basis: 100px; )
Зверніть увагу, що як і для будь-якої ширини, від’ємні довжини недійсні.
Демо
Перевірте цю ручку!
Підтримка браузера
- (сучасний) означає останній синтаксис із специфікації (наприклад
display: flex;
) - (гібрид) означає непарний неофіційний синтаксис 2011 року (наприклад
display: flexbox;
) - (старий) означає старий синтаксис 2009 року (наприклад
display: box;
)
Chrome | Сафарі | Firefox | Опера | IE | Android | iOS |
---|---|---|---|---|---|---|
21+ (сучасний) 20- (старий) | 3,1+ (старий) | 2-21 (старий) 22+ (новий) | 12,1+ (сучасний) | 10+ (гібрид) | 2,1+ (старий) | 3,2+ (старий) |
Браузер Blackberry 10+ підтримує новий синтаксис.
Для отримання додаткової інформації про змішування синтаксисів, щоб отримати найкращу підтримку браузера, зверніться до цієї статті (CSS-хитрощі) або цієї статті (DevOpera).