justify-content

Controla com es distribueixen els elements al llarg de l’eix principal (main axis): alineats al començament, al final, al centre o repartits amb espais variables.
justify-content: flex-start (per defecte)
1
2
3
Els elements s’alineen al començament de l’eix principal.
justify-content: flex-end
1
2
3
Els elements es col·loquen al final de l’eix principal.
justify-content: center
1
2
3
Els elements queden centrats.
justify-content: space-between
1
2
3
Primer element al començament, últim al final, i espai igual entre els del mig.
justify-content: space-around
1
2
3
Els elements tenen espai igual al voltant (els extrems reben la meitat).
justify-content: space-evenly
1
2
3
Tot l’espai (extrems i espais interns) és exactament igual.
En resum:

• flex-start → tot al començament (per defecte).
• flex-end → tot al final.
• center → centrat.
• space-between → primer i últim als extrems, espai igual entre la resta.
• space-around → espai igual al voltant (extrems amb la meitat).
• space-evenly → tots els espais exactament iguals.