clearВластивість прямо пов'язане з поплавками. Якщо елемент може поміститися горизонтально в просторі поруч з іншим елементом, який плаває, він буде. Якщо ви не застосовуєте clearцей елемент у тому ж напрямку, що і поплавок. Тоді елемент переміститься нижче плаваючого елемента.
Ось простий приклад макета, побудованого з поплавками, що може бути проблематично для нижнього колонтитула:
Але, очистивши елемент нижнього колонтитула, макет фіксується на своєму місці:
#footer ( clear: both; )
У цьому випадку зрозуміло: обидва; було використано для того, щоб нижній колонтитул очищав минулі елементи, які плавають у будь-якому напрямку. Але ви також можете очистити або, leftі rightв цьому випадку елемент переміститься нижче елементів, які плавають у цьому напрямку, але не в іншому.
Поширеним способом очищення поплавків є застосування псевдоелемента до елемента-контейнера, який очищає поплавок. Дізнайтеся більше про це тут.
Підтримка браузера
clearВластивість працює у всіх браузерах.