float：none | left | right
Default value : none
It applies to : all elements
none: Sets the object does not float left: Sets the object floating in the left right: the right to set objects floating
- When this attribute is not equal to none cause floating objects, objects will be treated as the object blocks (block-level), i.e., display properties equivalent to block. In other words, display characteristics of floating objects will be ignored.
- float in absolute positioning and display to none will not be applied.
- When to use float? So that when the element becomes a row, horizontal layout, text needs to surround effects -
- Floating characteristics, from the semi-normal flow, and the latter will have an impact element.
1, the height of the parent is not provided when, will collapse
2, the width of the parent is not enough, it will change rows
3, to change the type of the element into the line block - Clear float float of three methods
- Operating elements on the back.
Element is added to the back, clear: both;
1.1 Additional Labeling Act (after the last float label, add a new label, to set clear: both;) (not recommended)
2 BFC trigger effect.
By triggering BFC way to achieve clear float
Parent Adding overflow property (the parent element to add overflow: hidden) (not recommended)
Three pairs of parent element is operated.
3.1 Parent Adding overflow property (the parent element to add overflow: hidden) (not recommended)
3.2 after pseudo-elements to clear the floating (recommended)
3.3 double dummy elements before and after the floating Clear