Egenskapen clear

Egenskapen clear opphever flyt av ett element av andre, satt av egenskapen float. Kan ta følgende verdier: none (opphever virkningen av seg selv), both (opphever float samtidig fra høyre og venstre), left (opphever float fra venstre), right (opphever float fra høyre).

Syntaks

cssvelger {
  clear: none eller left eller right eller both
}

Eksempel

La oss oppheve flyt av bildet med tekst fra venstre:

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;
}

Результат:

Eksempel

Nå la oss oppheve flyt av bildet med tekst fra høyre:

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;
}

Результат:

Eksempel

La oss oppheve virkningen av egenskapen clear selv:

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;
}

Результат:

Se også