CSSда абсолют ота-рога нисбатан позиционирование

Олдинги дарсда биз шуни аникладки, агар ота-рога relative берилса, унда унинг авлодлари унга нисбатан абсолют позиционированиеланади. Бундай холда кўпинча ота-рога элементнинг нормал окимдан чиқиби кетмаслиги учун қилинади.

Шунингдек, ота-рога absolute берилган бўлиши мумкин. Бу холда absolute билан авлодлар браузер ойнасига нисбатан эмас, балки ўша ота-рога нисбатан позиционированиеланади:

<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;
}

Ўлчами 400px бўлган абсолют позиционирование билан квадрат блок яратинг. Унинг ичида яна иккита 50px ўлчамдаги блок яратинг. Биринчи блокни ота-роганинг ўнг юқори бурчагига, иккинчи блокни эса пастки чап бурчагига жойланг.