We can use the float
property to
put an element on the right or left
side inside its parent element. This takes the
element out of the normal page structure
and the other elements can
wrap around it:
The commonly used values for this property are:
In the above editor, try changing
the value of float
to right
and
notice how the image gets placed at
the right side inside the parent div
.
This makes the h1
and the p
element
shift to the left.
If we set the float
rule's value
to none
, you'll
see how the image and
other elements simply follow the
normal flow.