Vlastnost place-self
určí zarovnání položky na hlavní i příčné ose pro layouty v CSS.
Jde o zkratku pro vlastnosti align-self
a justify-self
.
Zapisuje se takto:
place-self: <hodnota align-self> <hodnota justify-self>;
Pokud není druhá hodnota přítomná, použije se první pro oba směry, ale jen za předpokladu, že je pro obě vlastnosti platná. Pokud tomu tak není, máme smůlu a bude neplatná celá deklarace.
Související
Jednoduchý příklad
V naší ukázce definujeme třísloupcový kontejner Gridu. Všechny tři položky mají omezenou výšku i šířku, aby byl hezky vidět efekt zarovnání, který zařídí vlastnost place-self
na třetí položce:
.item--3 {
place-self: end center;
}
Jak jste asi poznali, položky zarovnáváme svisle dolů (end
) a vodorovně n buňky (center
).
Možné hodnoty
Podívejte se na referenční příručku k oběma vlastnostem, pro které je place-items
zkratkou:
Podpora v prohlížečích
Vlastnost place-self
bohužel v době psaní tohoto textu nepodporuje Internet Explorer, ale ani Safari.
Aktuální informace hledejte na caniuse.com/place-self.
Komentáře
Váš názor? Vaše zkušenosti? Našli jste chybu?