# Отмена обтекания с помощью свойства clear в CSS

Для решения такой проблемы существует специальное свойство `clear`, которое отменяет обтекание. Значение `left` отменяет обтекание слева, значение `right` - справа, а значение `both` - с обоих сторон. Это значение и используется чаще всего.

Итак, свойство `clear` отменяет обтекание. В нашем случае это позволит нам сделать так, чтобы плавающая картинка из первого дива не налазила на второй див.

При этом `clear` следует давать тому элементу, на который не должны налазить плавающие элементы, то есть в нашем случае его стоит дать второму диву.

Давайте сделаем это - дадим второму диву кроме класса parent еще и класс `clearfix` и для этого нового класса зададим свойство `clear` в значении `both` - налезание картинки исчезнет:

`<div class="parent"> <img src="img.png" alt=""> text </div> <div class="parent clearfix"> text </div>` `.parent { border: 1px solid red; } .parent img { float: left; } .clearfix { clear: both; }`

:

Название `clearfix` является общепринятым, поэтому в дальнейшем используйте именно его.

← →
↑