CSS - place-items (umieść element)
Opublikowano wto 31 marca 2020 w css • 1 min read
Deklaracja place-items
(podobnie jak align-items
) odnosi się do pozycjonowania dzieci elementu, których układ jest zależny od układu Flexbox lub Grid.
Deklaracja place-items
jest połączeniem align-items
oraz justify-items
i przyjmuje podwójne wartości w odpowiadające kolejno za align-items
o następnie za justify-items
. Wymaga wcześniejszej deklaracji floatbox
lub grid
Przykładowe zastosowanie
.item {
display: flex;
place-items: start center;
}
i odpowiada to:
.item {
display: grid;
align-items: start;
justify-items: center;
}
W momencie kidy jedna wartość jest wskazana, wówczas przyjęta jest ona jako wspólna dla obu właściwości
Przykładowe zastosowanie
.item {
display: flex;
place-items: start;
}
i odpowiada to:
.item {
display: flex;
align-items: start;
justify-items: start;
}
Przyjmuje wartości auto
, normal, strech, start end, center, left, right, flex-start, flex-end, self-start, self-end, first-baseline, last-baseline
Źródło i polecane linki:
https://css-tricks.com/almanac/properties/p/place-items/
https://css-tricks.com/almanac/properties/a/align-items/