Пример 1

синий блок relative при смещении оставляет за собой занятое пространство, сам смещается на указанную позицию

head

cont

foot

Пример 2

синий блок relative зеленый absolute. Eсли у родительского элемента позиция static/по умолчанию/, то блок а1 будет удален из документа и расположится в углу окна, если relative, то расположится в углу родительского блока. Удаление блока из общей структуры не оставляет а ним место.

head

foot

Пример 3

синий блок relative зеленый и красный absolute. Порядок расположения блоков в коде не имеет значения. Блоки выравниваются позиционированием относительно синего блока relative.

head

foot

Пример 4

синий блок relative к блоку применен параметр overflow: hidden; зеленый и красный наследуют родительское расположение, к блоками применено float: right; и float: left;. К белому блоку применен параметр clear: both;. Если удалить этот параметр и оставить только overflow: hidden; в родительском блоке, то блок с расположится между а и в.

head

a1

Доехали вопреки ожиданиям быстро, примерно за 3-4 часа. Погода была пасмурная и даже не смотря на то, что мы находимся недалеко от экватора, было прохладно. Почти все время, пока мы ехали, по обе стороны дороги были банановые плантации, но все равно в голове не укладывается: эти бананы грузят на суда в нескольких портах Эквадора десятками тысяч тонн каждый день, круглый год.

b1

Судно.На первый взгляд судно неплохое, в относительно хорошем состоянии, хотя и 92 года постройки.

foot