Propriété justifyContent du style

Définition et utilisation

Lorsque les éléments ne utilisent pas tout l'espace disponible sur l'axe principal (horizontal), justifyContent Aligner les éléments du conteneur flexible.

Astuce :Utilisez alignContent Aligner les éléments sur l'axe horizontal (vertical).

Voir également :

Manuel de référence CSS :Propriété justifyContent

Exemple

Laisser de la place entre les éléments du <div> flexible :

document.getElementById("main").style.justifyContent = "space-between";

Essayez-le vous-même

Syntaxe

Retourner la propriété justifyContent :

object.style.justifyContent

Définir la propriété justifyContent :

object.style.justifyContent = "flex-start|flex-end|center|space-between|space-around|initial|inherit"

Valeur de l'attribut

Valeur Description
flex-start Valeur par défaut. Les éléments sont placés au début du conteneur.
flex-end Les éléments sont placés à la fin du conteneur.
center Les éléments sont placés au centre du conteneur.
space-between Laisser de la place pour les éléments entre les lignes.
space-around Laisser de la place pour les éléments avant, entre et après la ligne.
initial Réinitialise cette propriété à sa valeur par défaut. Voir également initial.
inherit Inherits cette propriété de son élément parent. Voir également inherit.

Détails techniques

Valeur par défaut : flex-start
Valeur de retour : Chaîne de caractères, représentant l'élément Propriété justifyContent.
Version CSS : CSS3

Support du navigateur

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Support 12.0 Support 9.0 Support

Pages associées

Manuel de style DOM HTML :Propriété alignContent

Manuel de style DOM HTML :Propriété alignItems

Manuel de style DOM HTML :Propriété alignSelf