- Floating point of attention
- Clear float
1. The essence is to clear the impact caused by float
2. If the parent box itself has a height, there is no need to clear the float
3. After clearing the float, the parent will automatically detect the height and will not affect other elements.
The strategy for clearing the float is closed float
left Clear the influence of floating on the left
right Clear the influence of floating on the right
both Clear the influence of floating on both sides
Generally used almostboth
clean:both;
- Clear floating method
1. Extra label method adds an empty element at the end of the floating element
这个添加的元素 必须为块级元素
2. Parent addition
overflow: hidden/auto/scroll;
3. Pseudo-element removal (upgrading the labeling method)
parent element addition
.clearfix::after {
content: "";
display: block;
height: 0;
clear: both;
visibility: hi