justowanie zawartości

Właściwość justify-content określa wyrównanie wzdłuż osi głównej.

Oś główna jest pozioma dla kierunku wiersza i pionowa dla kierunku kolumny.

Przyjmuje sześć wartości:

• flex-start - wyrównuje elementy do początku kontenera.
• flex-end - wyrównuje elementy do końca kontenera.
• center - wyrównuje elementy do środka kontenera.
• space-between - elementy są równomiernie rozmieszczone wzdłuż osi. Pierwszy element znajduje się na początku, a ostatni na końcu.
• space-around - elementy są równomiernie rozmieszczone wzdłuż osi, z jednakową ilością wolnego miejsca wokół każdego z nich.
• space-evenly - elementy są rozmieszczone tak, aby odstępy między dowolnymi dwoma elementami (oraz odstępy od krawędzi) były równe.

Domyślną wartością kontenera flex jest flex-start.

Przykład,

.container {
  display: flex;
  justify-content: flex-end;
}