Propriété align-self CSS

Définition et utilisation

align-self attribut spécifie le mode d'alignement des éléments sélectionnés dans le conteneur flexible.

Remarque :L'attribut alignSelf couvre le align-items Propriétés.

Voir également :

Tutoriel CSS :CSS Grid

Tutoriel CSS :Flexbox CSS

Manuel de référence CSS :Attribut alignContent

Manuel de référence CSS :Attribut alignItems

Manuel de référence CSS :Attribut justifySelf

Manuel de référence HTML DOM :Attribut alignSelf

Exemple

Aligner horizontalement au centre l'un des éléments à l'intérieur de l'élément flexible :

#myBlueDiv {
  align-self: center;
}

Essayez-le vous-même

Syntaxe CSS

align-self: auto|stretch|center|flex-start|flex-end|ligne de base|initial|inherit;

Valeur de l'attribut

Valeur Description
auto Par défaut. L'élément hérite de la propriété align-items du conteneur flexible parent, s'il n'y a pas de conteneur parent, il est "stretch".
stretch L'élément est étiré pour s'adapter au conteneur.
center L'élément est situé au centre du conteneur.
flex-start L'élément est situé au début du conteneur.
flex-end L'élément est situé à la fin du conteneur.
ligne de base L'élément est positionné sur la ligne de base du conteneur.
initial Rinitialise cette propriété à sa valeur par défaut. Voir : initial.
inherit Cette propriété est héritée de l'élément parent. Voir : inherit.

Détails techniques

Valeur par défaut : auto
Héritage : Non
Réalisation de l'animation : Non pris en charge. Voir :Propriétés liées aux animations.
Version : CSS3
Syntaxe JavaScript : object.style.alignSelf="center"

Support du navigateur

Les nombres dans le tableau indiquent la première version de navigateur qui prend en charge cette propriété.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
57.0 16.0 52.0 10.1 44.0