Definition and Usage
This property pushes floated elements in the opposite direction of the where they have been floated with 'float'. If one value is specified, it is the horizontal offset. If two values are specified, the first is the horizontal and the second is the vertical offset. If an element has only been floated horizontally (e.g., by setting 'float: right'), this property will only offset the float horizontally, even if a vertical value also has been specified. Likewise, if an element has only been floated vertically, this property will only offset the float vertically. If an element has been floated both horizontally and vertically, this property will offset both horizontally and vertically. If no vertical value has been specified, the vertical offset is set to zero.
| Name: | float-offset |
| Value: | <length> <length> ? |
| Initial: | 0 0 |
| Applies to: | floated elements |
| Inherited: | no |
| Percentages: | refer to width and height of containing block |
| Media: | visual, paged |
| Computed value: | one or two absolute lengths |
Syntax
float-offset: <length> <length> ?
Values
Negative values are allowed; a negative values will push the float in the same direction as it has been floated with 'float'
The float will never be pushed outside the content edges of the multicol element due to a setting on 'float-offset'.
Percentage values refer to the width/height of the float plus a fraction of the column gap.
Floats that are moved into other columns with this property intrudes.
Examples
div.quote {
float: top left multicol;
float-offset: 2.5gr;
width: 1gr;
}
img {
float: top left multicol;
float-offset: 1.5gr 50%;
width: 8em;
}
