Position: fixed
Různé způsoby využití fixované posice v CSS.
Kromě zafixování elementu na stránce:
div.fixovany {
position: fixed;
}
Má position: fixed
ještě jedno zajímavé využití.
Pro fixně umístěný element není možné vytvořit vlastní rámec, jako to jde při posicování absolutním. Rodiči absolutně umístěného prvku se přidá position: relative
, čímž se vynulují souřadnice pro následné absolutní posicování. Tohle pro fixed
nefunguje.
Fixní element má nulový bod souřadnic vždy v levém horním okraji stránky a nejde změnit. Mimochodem, tento bod není určen ani elementem <body>
a ani elementem <html>
, nemá na něj vliv žádný margin
nebo padding
, zkrátka nic.
Popsané chování někdy může vadit, ale také je v určitých případech velmi výhodné. Zvlášť u vytváření universálních JavaScriptů typu lightboxů nám position: fixed
hezky zaručí, že se náš skript nerozbije při stylování značky <body>
a podobně.
Vytvořit element přesně překrývající celou stránku je potom otázkou prostého:
.presCelouStranku {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
Komentáře