Gérer l’alignement des lignes selon l’axe secondaire : align-content

La propriété align-content n'agit que si les enfants sont disposés sur plusieurs lignes : la propriété flex-wrap du container doit donc être positionnée sur wrap ou à la rigueur sur wrap-reverse. (Dans le cas contraire, l'alignement se fait avec la propriété align-items).

La propriété align-content ne s'applique qu'aux conteneurs flex multilignes, et elle aligne les lignes flex à l'intérieur de sa rangée lorsqu'il y a plus d'espace dans l'axe transversal.

La propriété align-content n’a aucun effet si le conteneur flexible ne possède qu’une seule ligne.

Les valeurs possibles sont :
> flex-start (éléments positionnés au début container)
> flex-end (éléments positionnés à la fin du container)
> center (position centrale)
> space-between (répartition “justifiée”, horizontale ou verticale, entre les boîtes placées aux extrémités)
> space-around (variante de répartition “justifiée”, horizontale ou verticale, elle permet un espace égal entre les boîtes)
> strech les lignes s'étirent pour remplir tout l'espace (valeur par défaut)

Vers Etape 08