Svojstvo clear
Svojstvo clear otkazuje
obilazak jednog elementa drugima,
zadato svojstvom float.
Može da prima sledeće vrednosti:
none (otkazuje dejstvo samog sebe),
both (otkazuje float istovremeno sa desne i leve strane),
left (otkazuje float sa leve strane), right (otkazuje
float sa desne strane).
Sintaksa
selektor {
clear: none ili left ili right ili both
}
Primer
Hajde da otkažemo obilazak slike tekstom sa leve strane:
<img class="image" src="bg.png" alt="">
<div class="txt">
<p>
tekst tekst tekst tekst tekst tekst
tekst tekst tekst tekst tekst tekst
tekst tekst tekst tekst tekst tekst
tekst tekst tekst tekst tekst tekst
</p>
</div>
.image {
float: left;
padding-right: 10px;
}
.txt {
clear: left;
}
:
Primer
Sada hajde da otkažemo obilazak slike tekstom sa desne strane:
<img class="image" src="bg.png" alt="">
<div class="txt">
<p>
tekst tekst tekst tekst tekst tekst
tekst tekst tekst tekst tekst tekst
tekst tekst tekst tekst tekst tekst
tekst tekst tekst tekst tekst tekst
</p>
</div>
.image {
float: right;
padding-right: 10px;
}
.txt {
clear: right;
}
:
Primer
Hajde da otkažemo dejstvo samog
svojstva clear:
<img class="image" src="bg.png" alt="">
<div class="txt">
<p>
tekst tekst tekst tekst tekst tekst
tekst tekst tekst tekst tekst tekst
tekst tekst tekst tekst tekst tekst
tekst tekst tekst tekst tekst tekst
</p>
</div>
.image {
float: right;
padding-right: 10px;
}
.txt {
clear: none;
}
:
Vidite takođe
-
svojstvo
bottom,
koje zadaje poziciju donje ivice elementa -
svojstvo
top,
koje zadaje poziciju gornje ivice elementa -
svojstvo
left,
koje zadaje poziciju leve ivice elementa -
svojstvo
right,
koje zadaje poziciju desne ivice elementa -
pseudoelement
::backdrop,
koji zadaje pozicioniranje nakon prvog elementa -
svojstvo
caption-side,
koje zadaje poziciju naslova tabele
