About the three states used for float and position.
First of all, a brief introduction to the three states of position are fixed, absolute and relative, respectively.
First float is used to modify block-level elements, and here is an example of Div.
When the element makes a left float, it becomes a row, and if you use the right float, the elements are lined up, and the order is reversed (the green is on the left, while the right is on the right, and the red is on the left).
Float does not have any effect when used with the fixed modifier, because itself and out of the document flow can no longer float, but only through the specific values or percentages of absolute control position, and will not change as the page changes, so does not have any impact on other elements. Typically used as an element with global display.
Absolute will also break away from normal document flow, but the difference between him and fixed is that he will be influenced by the parent container, and if two elements are absolute at the same time, they will affect each other. Similarly, the float will be ineffective, not with the floating characteristics, the positioning method ibid. If one of the elements is absolute and the other is not, it will not affect each other and will directly overwrite the
Relative is the default arrangement in which the current element remains in the normal document stream.
Summarize:
Fixed: fix element position, break away from normal document flow, no matter how the elements in the page change, the current fixed element is always in place, generally used for some top menu
Absolute: Leaving the current element out of the normal document stream, changing the position of the current element (Left,top,right,bottom) does not affect the neighboring elements, if you use margin, The Padding property also does not affect the adjacent element (unless the adjacent element is also absolutely positioned)
Relative: The current element remains in the normal document stream, and the position of the current element (Left,top,right,bottom) does not affect the neighboring element, but if you leave the Margin,padding property value white, The nearby elements will be affected by the position and change