position: relative;
Deze wordt vaak verkeerd begrepen. "Position relative" betekent dat de positie wordt bepaald naar aanleiding van het punt waar het element normaal gesproken verschenen zou zijn als de position static zou zijn geweest. Als ik dit doe:
#mijndiv {
position: relative;
top: 10px; /* de afstand tot de top */
left: 10px; /* de afstand tot de linkerkant */
}
dan verschijnt de div met id "mijndiv" 10 pixels lager en meer naar rechts dan hij normaal gesproken zou zijn verschenen. Als je alleen dit doet:
#mijndiv {
position: relative;
}
verschijnt hij op dezelfde plek als anders. Wat heeft het dan voor nut? Als bepaalde pagina-elementen in Internet Explorer niet verschijnen wil het vaak helpen om de position op relative te zetten. Een ander nut is dat het gebruiken van relative gevolgen heeft voor de elementen binnenin die div die op position: absolute; staan. Hierover zometeen meer.
Inhoudsopgave
- Inleiding
- position: static;
- position: relative;
- position: absolute;
- Nuancering absolute
- position: fixed;
- Internet Explorer ellende
- Tot slot