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

cssselektor {
  clear: none ili left ili right ili both
}

Primer

Hajde da otkažemo obilazak slike tekstom sa leve strane:

html<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>

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

Результат:

Primer

Sada hajde da otkažemo obilazak slike tekstom sa desne strane:

html<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>

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

Результат:

Primer

Hajde da otkažemo dejstvo samog svojstva clear:

html<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>

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

Результат:

Vidite takođe