CSS Position

Занятие на тему:
CSS Position
Горбачевский Валерий

CSS Position
3
Запихни это куда хочешь!

Встречайте свойство "position"
4

position: static;
static является значением по умолчанию. Элемент с position: static; отображается как обычно и не будет позиционироваться каким-либо специальным способом, он просто плюхнется вниз.
5

position: relative;
6

position: relative;
7

position: absolute;
8

Точка отсчета координат
9
По умолчанию «абсолютные» элементы позиционируются в системе координат, привязанной к окну браузера. Однако, систему координат можно изменить.

схлопывание родителя если ему не заданы размеры:
10

Absolute Centering
11

CSS Padding hack
12

position: fixed;
13

z-index
14

Задание
15
Добавьте разные значения top, left, а потом position:relative;

Задание 2
16

Задание 3
17

Overflow
18

Overflow и box-shadow
19