Отмена на опколнување со својството clear во CSS

За решавање на ваквиот проблем постои специјално својство clear кое ја откажува опколнувањето. Вредноста left ја откажува опколнувањето од лево, вредноста right - од десно, а вредноста both - од двете страни. Оваа вредност е онаа која најчесто се користи.

Значи, својството clear ја откажува опколнувањето. Во нашиот случај ова ќе ни овозможи да направиме така што лебдечката слика од првиот div нема да се наметнува на вториот div.

Притоа clear треба да се зададе на оној елемент на кој не треба да се наметнуваат лебдечките елементи, односно во нашиот случај вреди да му се даде на вториот div.

Ајде да го направиме ова - да му дадеме на вториот div покрај класата 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 е општо прифатено, затоа во иднина користете го токму тоа.