Apjošanas atcelšana ar CSS īpašību clear

Lai atrisinātu šādu problēmu, pastāv īpaša īpašība clear, kas atceļ apjošanu. Vērtība left atceļ apjošanu no kreisās puses, vērtība right - no labās puses, bet vērtība both - no abām pusēm. Šī vērtība tiek izmantota visbiežāk.

Tātad, īpašība clear atceļ apjošanu. Mūsu gadījumā tas ļaus mums panākt, lai peldējošais attēls no pirmā div neuzkāptu uz otro div.

clear jāpiešķir tam elementam, uz kuru nedrīkst uzkāpt peldējošie elementi, tas ir, mūsu gadījumā to vajadzētu piešķirt otrajam div.

Izdarīsim to - piešķirsim otrajam div bez klases parent vēl arī klasi clearfix un šim jaunajam klasē iestatīsim īpašību clear ar vērtību both - attēla uzkāpšana izzudīs:

<div class="parent">
	<img src="img.png" alt="">
	teksts
</div>
<div class="parent clearfix">
	teksts
</div>

.parent {
	border: 1px solid red;
}
.parent img {
	float: left;
}

.clearfix {
	clear: both;
}

Nosaukums clearfix ir vispārpieņemts, tāpēc turpmāk izmantojiet tieši to.