Positsioneerimine absoluutse vanema suhtes CSS-is
Eelmises õppetükis uurisime, et kui vanemale määrata relative, siis
tema järeltulijad positsioneeritakse absoluutselt
tema suhtes. Nii tehakse enamasti siis,
kui soovitakse, et vanemaelement
ei väljuks tavalisest voost.
Võib juhtuda ka nii, et vanemal on määratud
absolute. Sel juhul positsioneeritakse järeltulijad
absolute-ga samuti sellise vanema suhtes, mitte brauseri akna suhtes:
<div id="parent">
<div id="child"></div>
</div>
#parent {
position: absolute;
top: 100px;
left: 200px;
width: 500px;
height: 300px;
border: 1px solid red;
}
#child {
position: absolute;
top: 0;
left: 0;
width: 200px;
height: 200px;
border: 1px solid green;
}
:
Looge absoluutse positsioneerimisega ruudukujuline plokk suurusega 400px.
Selle sees looge kaks plokki suurusega 50px.
Asetage esimene plokk vanema ülemisse paremasse
nurka ja teine plokk - vanema alumisse
vasakusse nurka.