Īpašība clear

Īpašība clear atceļ elementa applūšanu ar citiem elementiem, kuru nosaka īpašība float. Tai var būt šādas vērtības: none (atceļ pašas sevis darbību), both (atceļ float vienlaicīgi pa labi un pa kreisi), left (atceļ float pa kreisi), right (atceļ float pa labi).

Sintakse

selektors {
	clear: none vai left vai right vai both
}

Piemērs

Atcelsim attēla applūšanu ar tekstu pa kreisi:

<img class="image" src="bg.png" alt="">
<div class="txt">
	<p>
		teksts teksts teksts teksts teksts teksts
		teksts teksts teksts teksts teksts teksts
		teksts teksts teksts teksts teksts teksts
		teksts teksts teksts teksts teksts teksts
	</p>
</div>

.image {
	float: left;
	padding-right: 10px;
}
.txt {
	clear: left;
}

Piemērs

Tagad atcelsim attēla applūšanu ar tekstu pa labi:

<img class="image" src="bg.png" alt="">
<div class="txt">
	<p>
		teksts teksts teksts teksts teksts teksts
		teksts teksts teksts teksts teksts teksts
		teksts teksts teksts teksts teksts teksts
		teksts teksts teksts teksts teksts teksts
	</p>
</div>

.image {
	float: right;
	padding-right: 10px;
}
.txt {
	clear: right;
}

Piemērs

Atcelsim pašas īpašības clear darbību:

<img class="image" src="bg.png" alt="">
<div class="txt">
	<p>
		teksts teksts teksts teksts teksts teksts
		teksts teksts teksts teksts teksts teksts
		teksts teksts teksts teksts teksts teksts
		teksts teksts teksts teksts teksts teksts
	</p>
</div>

.image {
	float: right;
	padding-right: 10px;
}
.txt {
	clear: none;
}

Skatiet arī

īpašība bottom,
kura nosaka elementa apakšējās malas pozīciju
īpašība top,
kura nosaka elementa augšējās malas pozīciju
īpašība left,
kura nosaka elementa kreisās malas pozīciju
īpašība right,
kura nosaka elementa labās malas pozīciju
pseidoelements ::backdrop,
kurs norāda izvietojumu pēc pirmā elementa
īpašība caption-side,
kura nosaka tabulas virsraksta pozīciju