Svojstvo float za blokove u CSS

Svojstvo float primenjivo je ne samo na slike, već i na bilo koje druge blokove.

Hajde da to proverimo.

Neka imamo roditeljski blok sa klasom parent, a unutar njega se nalazi tekst i dete blok sa klasom child. Oba bloka imaju zadatu granicu, a detetu i širinu sa visinom:

html<div class="parent">
  <div class="child"></div>
  some long text
</div>

css.parent {
  border: 1px solid red;
  text-align: justify;
}
.child {
  width: 200px;
  height: 100px;
  border: 1px solid green;
}

Результат:

Hajde sada da detetu postavimo float na vrednost left - tekst će početi da teče oko našeg bloka:

html<div class="parent">
  <div class="child"></div>
  some long text
</div>

css.parent {
  border: 1px solid red;
  text-align: justify;
}
.child {
  float: left;
  width: 200px;
  height: 100px;
  border: 1px solid green;
}

Результат: