La flex-basisproprietà è una proprietà secondaria del modulo Layout riquadro flessibile.
Specifica la dimensione iniziale dell'elemento flessibile, prima che lo spazio disponibile venga distribuito in base ai fattori di flessibilità. Quando viene omesso flexdall'abbreviazione, il valore specificato è la lunghezza zero.
Un valore di base flessibile impostato per autoridimensionare l'elemento in base alla sua proprietà size (che può essere essa stessa la parola chiave auto, che ridimensiona l'elemento in base al suo contenuto).
Sintassi
flex-basis: .flex-item ( flex-basis: 100px; )Si prega di notare che come per qualsiasi larghezza, le lunghezze negative non sono valide.
Demo
Supporto browser
- (moderno) indica la sintassi recente dalla specifica (ad esempio
display: flex;) - (ibrido) indica una strana sintassi non ufficiale del 2011 (es.
display: flexbox;) - (vecchio) indica la vecchia sintassi del 2009 (ad esempio
display: box;)
| Cromo | Safari | Firefox | musica lirica | IE | Android | iOS |
|---|---|---|---|---|---|---|
| 21+ (moderno) 20- (vecchio) | 3.1+ (vecchio) | 2-21 (vecchio) 22+ (nuovo) | 12.1+ (moderno) | 10+ (ibrido) | 2.1+ (vecchio) | 3.2+ (vecchio) |
Il browser Blackberry 10+ supporta la nuova sintassi.
Per ulteriori informazioni su come mescolare le sintassi per ottenere il miglior supporto del browser, fare riferimento a questo articolo (CSS-Tricks) o questo articolo (DevOpera).