Justowanie zawartości {justify-content}
Jak równomiernie wyrównać elementy na stronie?
CSS 3
selektor { justify-content: justowanie }
Selektorem może być kontener elastyczny.
Justowanie:
Justowanie:
- flex-start - do początkowej krawędzi kontenera (domyślnie)
- flex-end - do końcowej krawędzi kontenera
- center - wyśrodkowanie
- space-between - równe odstępy między elementami
- space-around - równa przestrzeń wokół elementów
Polecenie steruje justowaniem elementów kontenera elastycznego, gdy jest on zbyt duży, aby został wypełniony w całości. Działa analogicznie jak justowanie tekstu, ale może operować na blokach.
Przykład {justify-content}
justify-content: flex-start
blok 1
blok 2
blok 3
justify-content: flex-end
blok 1
blok 2
blok 3
justify-content: center
blok 1
blok 2
blok 3
justify-content: space-between
blok 1
blok 2
blok 3
justify-content: space-around
blok 1
blok 2
blok 3
Przeglądarki
Chrome | Firefox | Edge | Opera | Safari | |
---|---|---|---|---|---|
justify-content: wartość | 29 2013-08-20 | 20 2013-04-02 | 12 2015-07-29 | 12.1 2012-11-20 | 9 2015-09-30 |