Avertissement : Cette propriété reflète une ancienne version du standard pour le module CSS sur les boîtes flexibles. La propriété -moz-box-direction est uniquement utilisée pour XUL et l'ancienne propriété standard box-direction a depuis été remplacée par flex-direction.
La propriété box-direction définit si une boîte doit organiser son contenu dans la direction normale (de haut en bas ou de gauche à droite). Pour plus de détails sur les propriétés des éléments flexibles, voir la page Flexbox.
| Valeur initiale | normal |
|---|---|
| Applicabilité | éléments avec display qui vaut box ou inline-box |
| 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
normal | reverse | inherit
Valeurs
normal- La boîte répartit son contenu à partir du début (le côté gauche si la boîte est orientée horizontalement ou le côté haut si la boîte est orientée verticalement).
reverse- La boîte répartit son contenu à partir de la fin (le côté droit si la boîte est orientée horizontalement ou le côté bas si la boîte est orienté verticalement).
Exemples
.exemple {
/* du bas vers le haut */
-moz-box-direction: reverse; /* Mozilla */
-webkit-box-direction: reverse; /* WebKit */
box-direction: reverse;
}
Notes
Si la direction de l'élément est définie grâce à l'attribut dir, la déclaration est ignorée.
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) | Edge | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
| Support simple | (Oui)-webkit | (Oui)-moz[1] | (Oui)-webkit | Pas de support | (Oui)-webkit | 1.1-khtml 3.0-webkit |
| Fonctionnalité | Android | Chrome pour Android | Firefox Mobile (Gecko) | Edge | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|---|
| Support simple | ? | ? | (Oui) -moz[1] | (Oui)-webkit | 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.