CSS float property for blocks

The float property applies not only to images, but also to any other blocks.

Let's check this out.

Let's say we have a parent div with class parent, and inside it there is text and a child div with class child. Both divs are given a border, and the child div also has a width and height:

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

Результат:

Now let's set the child div's float to left - the text will start to flow around our block:

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

Результат: