Dans le cours : CSS : Maîtriser les Flexbox

Accédez au cours complet aujourd’hui

Inscrivez-vous aujourd’hui pour accéder à plus de 24 100 cours dispensés par des experts.

Positionner plusieurs lignes d'éléments flex

Positionner plusieurs lignes d'éléments flex - Tutoriel CSS

Dans le cours : CSS : Maîtriser les Flexbox

Démarrer mon mois d’essai gratuit Acheter pour mon équipe

Positionner plusieurs lignes d'éléments flex

“

Vous connaissez maintenant les principes de base qui régissent le fonctionnement des flexbox et nous avons passé en revue quelques cas d'utilisation typiques. Il est temps d'aller un peu plus loin. Nous avons donc un flex container avec dix éléments dedans. Au niveau du code, nous avons un flex wrap qui est égal à wrap, donc on a un passage à la ligne. Nous avons également justify-content: space-around. L'espace restant sur l'axe principal, l'axe horizontal chez moi, est donc réparti autour de ces éléments. Voilà ce que cela donne pour le moment. Grâce à cette situation, nous allons pouvoir étudier une autre propriété, qui est cette fois align-content. Le nom de cette propriété commence par align. Nous travaillons au niveau de l'axe secondaire, l'axe vertical dans cet exemple, qui va de haut en bas. Les valeurs possibles pour cette propriété ressemblent très fort à ce que l'on avait pour les propriétés justify-content et align-items. La valeur par défaut est d'ailleurs la valeur…

Table des matières