La flex-basispropriété est une sous-propriété du module Disposition de boîte flexible.
Il spécifie la taille initiale de l'élément flexible, avant que tout espace disponible ne soit distribué en fonction des facteurs flex. Lorsqu'elle est omise du flexraccourci, sa valeur spécifiée est la longueur zéro.
Une valeur de base flexible définie pour autodimensionner l'élément en fonction de sa propriété size (qui peut elle-même être le mot-clé auto, qui dimensionne l'élément en fonction de son contenu).
Syntaxe
flex-basis: .flex-item ( flex-basis: 100px; )Veuillez noter que comme pour toute largeur, les longueurs négatives ne sont pas valides.
Démo
Prise en charge du navigateur
- (moderne) signifie la syntaxe récente de la spécification (par exemple
display: flex;) - (hybride) signifie une syntaxe non officielle étrange de 2011 (par exemple
display: flexbox;) - (ancien) signifie l'ancienne syntaxe de 2009 (par exemple
display: box;)
| Chrome | Safari | Firefox | Opéra | C'EST À DIRE | Android | iOS |
|---|---|---|---|---|---|---|
| 21+ (moderne) 20- (ancien) | 3.1+ (ancien) | 2-21 (ancien) 22+ (nouveau) | 12.1+ (moderne) | 10+ (hybride) | 2.1+ (ancien) | 3.2+ (ancien) |
Le navigateur Blackberry 10+ prend en charge la nouvelle syntaxe.
Pour plus d'informations sur la façon de mélanger les syntaxes afin d'obtenir le meilleur support du navigateur, veuillez vous référer à cet article (CSS-Tricks) ou à cet article (DevOpera).