Nuancering absolute

We gaan position absolute iets nuanceren. Het kan twee dingen betekenen.

1) ten opzichte van het browser-venster (lees: de html tag)
2) ten opzichte van het element waarin hij zich bevindt, als dat element als position een van de volgende waarden heeft: relative, absolute of fixed

Met andere woorden: als ik div1 met position absolute in div2 met position relative stop, is de positie van div1 afhankelijk van div2. In het voorbeeld hierboven zou
je het dus zo kunnen aanpakken:

#container {
position: relative;
}
#content {
position: absolute;
top: 3px;
left: 3px;
}

<div id="header">
<div id="container">
<div id="content">
</div>
</div>
</div>

Als de header om de een of andere reden groter wordt, verschuift de container (relative) daaronder mee en de content (absolute) ook, aangezien hij zich in een div met position relative bevindt (container).

« Lees de omschrijving en reacties