Float things

This is an image in the normal flow. This is an image in the normal flow. This is an image in the normal flow. This is an image in the normal flow. This is an image in the normal flow. This is an image in the normal flow. This is an image in the normal flow. This is an image in the normal flow. This is an image in the normal flow. This is an image in the normal flow. This is an image in the normal flow. This is an image in the normal flow.

This is an image that is floated. This is an image that is floated. This is an image that is floated. This is an image that is floated. This is an image that is floated. This is an image that is floated. This is an image that is floated. This is an image that is floated. This is an image that is floated. This is an image that is floated. This is an image that is floated. This is an image that is floated. This is an image that is floated. This is an image that is floated. This is an image that is floated. This is an image that is floated. This is an image that is floated. This is an image that is floated.
This is the first inside container.
This is the second inside container.
This is the third inside container.

Floats can stack up left to right or right to left. Always provide a width for floated block elements.

This is the first inside container.
This is the second inside container.
This is the third inside container.

You can use clear to prevent content wrapping

This is the first inside container.
This is the second inside container.
This is the third inside container.

You can float opposite directions

This is the first inside container.
This is the second inside container.
This is the third inside container.

You can use overflow:auto to contain floats

This is the first inside container.
This is the second inside container.

You can also float the outside container to contain floats

This is the first inside container.
This is the second inside container.

Elements do not float higher than their reference in the source.

This is the first inside container.
This is the second inside container.
This is the third inside container.

If the content widths along with side padding and borders exceeds the avaialble space, you will get float drop.

This is the first inside container.
This is the second inside container.
This is the third inside container.