Узнать, как создать очистку поплавка с помощью clearfix используя HTML, CSS.
Очистка поплавка
Элементы после плавающего элемента будут обтекать его. Используйте взлом "clearfix", чтобы решить эту проблему:
Без Clearfix
С Clearfix
Создать очистку поплавка
Если элемент выше, чем элемент, содержащий его, и он плавает, он будет переполнен за пределами своего контейнера.
Тогда мы можем добавить overflow: auto; к содержащему элементу, чтобы устранить эту проблему:
.clearfix {
overflow: auto;
}Попробуйте сами »Переполнение overflow:auto clearfix работает хорошо, пока вы можете контролировать свои поля и отступы (иначе вы можете увидеть полосы прокрутки). Новый, современный взлом clearfix, тем не менее, безопаснее использовать, и следующий код используется для большинства веб-страниц:
.clearfix::after {
content: "";
clear: both;
display: table;
}Попробуйте сами »Совет: Узнайте больше о поплавках в нашем учебнике CSS Поплавок.