⑤Управление потоком рядом с плавающими элементами: свойство clear

Продолжим изучение темы CSS - позиционирование. Если пропустили прошлые статьи, то вот ссылки на них:

Схемы позиционирования

Содержание:

1. Содержащий блок

2. Выбор схемы позиционирования: свойство position

3. Смещение блока: свойства top, right, bottom, left

4. Обтекание: свойство float

5. Управление потоком рядом с плавающими элементами: свойство clear

6. Определение контекста наложения: свойство z-index

6.1. Контекст наложения

5. Управление потоком рядом с плавающими элементами: свойство clear

Свойство clear указывает, какие стороны блока/блоков элемента не должны прилегать к плавающим блокам, находящемся выше в исходном документе. В CSS2 и CSS 2.1 свойство применяется только к не плавающим элементам уровня блока.

Свойство не наследуется.

clear

Значение:

none - Означает отсутствие ограничений на положение элемента относительно плавающих блоков. Значение по умолчанию.
left - Смещает элемент вниз относительно нижнего края любого плавающего слева элемента, находящемся выше в исходном документе.
right - Смещает элемент вниз относительно нижнего края любого плавающего справа элемента, находящемся выше в исходном документе.
both - Смещает элемент вниз относительно нижнего края любого плавающего слева и справа элемента, находящемся выше в исходном документе.
inherit - Наследует значение свойства от родительского элемента.

Синтаксис

CSS

clear: none;
clear: left;
clear: right;
clear: both;
clear: inherit;

Для предотвращения отображение фона или границ под плавающими элементами используется правило {overflow: hidden;}.

Продолжение в следующей статье!