Style CSS

Spis alfabetyczny stylów CSS.

Ściąga CSS - przykłady, style CSS alfabetycznie, spis stylów CSS, właściwości CSS, skorowidz stylów CSS.

!important

E
empty-cells

J
justify-content

K
@keyframes

Q
quotes

Z
z-index

Strona w trakcie modernizacji

Zapraszamy wkrótce

Właściwość CSS flex

Definicja stylu, przeznaczenie i użycie flex

Właściwość flex jest skróconą właściwością dla:
flex-grow
flex-shrink
flex-base

Właściwość flex ustawia długość elastycznych elementów.

Właściwości flex oraz z góry zdefiniowana grupy wartości określa kilka różnych cech elastyczności obszaru zawartości kolejnych elementów dzieci elementu HTML tworzącego układ elastyczny.

Uwaga: Jeśli element nie jest elementem elastycznym, właściwość flex nie działa.

Wartości właściwości flex

Wartość	Opis
flex-grow	Liczba określająca, jak bardzo element wzrośnie w porównaniu z pozostałymi elementami elastycznymi.
flex-shrink	Liczba określająca, jak bardzo element zmniejszy się w stosunku do pozostałych elementów elastycznych.
flex-basis	Długość elementu. Dozwolone wartości: auto, inherit lub liczba, po której następuje %, px, em lub inna jednostka długości.
auto	To samo co 1 1.
none	To samo co 0 0.
initial	To samo co 0 1.
inherit	Dziedziczy tę właściwość z elementu nadrzędnego.

Składnia CSS flex

flex: flex-grow flex-shrink flex-basis | auto | initial | inherit;

Wsparcie przeglądarek dla właściwości flex

Liczba w tabeli określa pierwszą wersję przeglądarki w pełni obsługującą tę właściwość.

Liczby przed -moz-, -ms-, -moz- określają pierwszą wersję, która działała z prefiksem.

Właściwość
flex	29.0 21.0 -webkit-	11.0 10.0 -ms-	28.0 18.0 -moz-	9.0 6.1 -webkit-	17.0

Przykładowe zastosowania właściwości flex

flex: 1 0 40%;

flex: 2 0 15%;

flex: 3 0 20%;