Позиціювання щодо абсолютного батька на 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;
}