Exemple
Positionner les éléments de la flexibilité <div> élément avec l' espace entre les lignes:
// Code for Safari 7.0+
document.getElementById("main").style.WebkitAlignContent = "space-between";
// Standard syntax
document.getElementById("main").style.alignContent
= "space-between"; Essayez vous - même » Définition et utilisation
La propriété alignContent aligne les éléments du conteneur flexible lorsque les éléments ne pas utiliser tout l' espace disponible sur le axe transversal (vertically) .
Conseil: Utiliser la propriété justifyContent pour aligner les points de l'axe principal (horizontally) .
Note: Il doit y avoir plusieurs lignes d'articles pour cette propriété d'avoir un quelconque effet.
Support du navigateur
Les chiffres du tableau indiquent la première version du navigateur qui prend en charge entièrement la propriété.
Les chiffres suivis par Webkit précisent la première version qui a travaillé avec un préfixe.
| Propriété | |||||
|---|---|---|---|---|---|
| alignContent | 21,0 | 11.0 | 28,0 | 7.0 Webkit | 12.1 |
Note: Le support Safari une alternative, la propriété WebkitAlignContent.
Syntaxe
Retour la propriété alignContent:
object .style.alignContentDéfinissez la propriété alignContent:
object .style.alignContent="stretch|center|flex-start|flex-end|space-between|space-around|initial|inherit"
Valeurs de propriété
| Valeur | La description |
|---|---|
| stretch | Valeur par défaut. Les articles sont étirés pour remplir le récipient |
| center | Les éléments sont positionnés au centre du récipient |
| flex-start | Les éléments sont positionnés au début du conteneur |
| flex-end | Les éléments sont positionnés à l'extrémité du récipient |
| space-between | Les éléments sont positionnés avec un espace entre les lignes |
| space-around | Les éléments sont positionnés avec un espace avant, entre et après les lignes |
| initial | Définit cette propriété à sa valeur par défaut. Lisez à propos initial |
| inherit | Hérite cette propriété de son élément parent. En savoir plus sur hériteront |
Détails techniques
| Valeur par défaut: | étendue |
|---|---|
| Valeur de retour: | Une chaîne, ce qui représente la propriété align-contenu d'un élément |
| version CSS | CSS3 |
Pages associées
Référence CSS: align-content property
HTML DOM STYLE Référence: alignItems property
HTML DOM STYLE Référence: alignSelf property
HTML DOM STYLE Référence: justifyContent property
<Style objet