# CSS Float

## CSS Float

//the following example specifies that an image should float to the right in a text

img {
float: right;
}
//in the following example the image will be displayed just where it occurs
// in the text (float: none;)

img {
float: none;
}
//with the float property, it is easy to float boxes of content side by side

* {
box-sizing: border-box;
}

.box {
float: left;
width: 33.33%; /* three boxes (use 25% for four, and 50% for two, etc) */
padding: 50px; /* if you want space between the images */
}
• Specifies how an element should float.
• Is used for positioning and formatting content e.g. let an image float left to the text in a container.
• Can have one of the following values: left (the element floats to the left of its container), right (the element floats to the right of its container), none (the element does not float; will be displayed just where it occurs in the text; this is default), inherit (the element inherits the float value of its parent).
• In its simplest use can be used to wrap text around images.

CSS Float

## CSS Float — Structure map

Clickable & Draggable!