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.

« Lees de omschrijving en reacties

Inhoudsopgave

  1. Inleiding
  2. position: static;
  3. position: relative;
  4. position: absolute;
  5. Nuancering absolute
  6. position: fixed;
  7. Internet Explorer ellende
  8. Tot slot

PHP tutorial opties

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.