Vítejte na webu Garth.cz. Pokud jste programátor nebo se o programování, programovací jazyky a příbuzná témata zajímáte, naleznete zde pravděpodobně nějaké užitečné informace.
Stránkám se věnuji ve volném čase a jejich obsah vkládám postupně, mějte prosím trpělivost i s kategoriemi, které se plní velmi pozvolna. Pokud se chcete podělit o vlastní poznatky, rady nebo zkušenosti, neváhejte a napište.
V obecné rovině zde mluvíme o všech IT tématech, která lze potkat v reálném či virtuálním světě. Co vám stojí za kliknutí, stojí prostě i za hovor.
position: static | relative | absolute | fixed | sticky
Určuje, jak se prvek umístí: v normálním toku stránky, posunutý, vytažený z toku a umístěný vůči rodiči nebo oknu, nebo „přilepený“ při posouvání. Samotnou polohu pak nastavují top, right, bottom a left.
top | right | bottom | left: auto | <délka> | <procenta>
Čtyři vlastnosti, které určují polohu prvku s nastavenou position (jinou než static). Co přesně znamenají, záleží na druhu umístění: u relative posun od původního místa, u absolute vzdálenost od hrany rodiče, u fixed od hrany okna.
inset: <top> [<right> [<bottom> [<left>]]]
Zkratka, která najednou nastaví top, right, bottom a left. Nejčastěji se píše inset: 0 – absolutně umístěný prvek pak přesně pokryje rodiče.
z-index: auto | <celé číslo>
Určuje pořadí překrývajících se prvků „směrem k divákovi“: prvek s vyšším číslem je nahoře. Působí na umístěné prvky (position jiná než static) a na položky flexboxu a gridu.
isolation: auto | isolate
S hodnotou isolate udělá z prvku samostatný kontext vrstev (stacking context), aniž by bylo potřeba nastavovat position a z-index nebo měnit vzhled. Potomci se pak překrývají a míchají barvy jen uvnitř prvku.
float: none | left | right | inline-start | inline-end
Vytáhne prvek k levé nebo pravé straně rodiče a nechá okolní text a řádkové prvky obtékat kolem něj – typicky obrázek v článku. Dřív se float používal i na skládání sloupců; na to jsou dnes flexbox a grid.