Avertissement : Cette propriété était décrite dans les premières versions de la spécification pour les boîtes flexibles (flexbox) et a été remplacée dans les versions suivantes.
Voir la page Flexbox pour plus d'informations.
La propriété box-ordinal-group permet d'affecter les éléments fils d'une boîtes flexible à un groupe numéroté. Pour plus de détails, se référer à la page Flexbox qui décrit les différentes propriétés des boîtes flexibles.
Les groupes ordinaux peuvent être utilisés avec la propriété box-direction afin de contrôler l'ordre dans lequel les éléments fils apparaissent dans la boîte. Lorsque la valeur calculée de box-direction est normal, une boîte affichera ses éléments en commençant par le groupe dont l'ordre est le plus faible et les disposera de gauche à droite pour les boîtes horizontales et du haut vers le bas pour les boîtes verticales. Les éléments dont l'ordre est égal seront disposés dans l'ordre dans lequel ils apparaissent. Lorsque la direction est inversée, les ordres sont gérés de la même façon, les éléments apparaîtront dans l'ordre inverse.
| Valeur initiale | 1 |
|---|---|
| Applicabilité | les éléments fils des éléments de boîte |
| Héritée | non |
| Média | visuel |
| Valeur calculée | comme spécifié |
| Type d'animation | discrète |
| Ordre canonique | l'ordre unique et non-ambigu défini par la grammaire formelle |
Syntaxe
/* Un entier indiquant le groupe */ /* Type <integer> */ box-ordinal-group: 1; box-ordinal-group: 5; /* Global values */ box-ordinal-group: inherit; box-ordinal-group: initial; box-ordinal-group: unset;
Valeurs
<integer>- Un entier positif.
Syntaxe formelle
<integer>
Spécifications
Brouillon de travail pour le module des boîtes flexibles (W3C)
Ancienne version de la spécification.
Compatibilité des navigateurs
| Fonctionnalité | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| Support simple | (Oui)-webkit | (Oui)-moz[1] | Pas de support | (Oui)-webkit | 1.1-khtml 3.0-webkit |
| Fonctionnalité | Android | Chrome pour Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|
| Support simple | ? | ? | ?[1] | Pas de support | ? | 1.0-webkit |
[1] En plus de la version préfixée, Gecko 48.0 (Firefox 48.0 / Thunderbird 48.0 / SeaMonkey 2.45) prend en charge la version préfixée par -webkit à des fins de compatibilité web grâce à la préférence layout.css.prefixes.webkit dont la valeur par défaut vaut false. Depuis Gecko 49.0 (Firefox 49.0 / Thunderbird 49.0 / SeaMonkey 2.46), cette valeur par défaut est passée à true.