Уласцівасць float для блокаў у CSS

Уласцівасць float дастасавальная не толькі да карцінак, але і да любых іншых блокаў.

Давайце праверым гэта.

Хай у нас ёсць дыў-бацька з класам parent, а ўнутры яго знаходзіцца тэкст і дыў-нашчадак з класам child. Абодвум дывам зададзена мяжа, а дыву нашчадку яшчэ і шырыня з вышынёй:

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

Результат:

Давайце цяпер дыву-нашчадку ўсталюем float у значэнне left - тэкст пачне агінаць наш блок:

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

Результат: