CSS to clear floating methods

float in CSS:

Float:left left float

Float:right Right Float

Float:none not floating

Float:inherit inherit floating (inherit parent element floating property, inherit fails if parent element has no floating attribute)

What issues are floating: 1. The parent element collapses, with no height. 2. The adjacent element in the Web page appears in a different position

Several ways to clear floating:

1. Manually add a high disadvantage to the parent element: If the child element is too large and the number is indeterminate, the setting is more complex.

<! DOCTYPE html>
2. Use the Clear property

<! DOCTYPE html>
3. Add the overflow attribute to the parent element and use it in conjunction with Zoom:1

<! DOCTYPE html>
4. Adding floating disadvantage to Parent element: adjacent element position exception

<! DOCTYPE html>
5. Using: After pseudo-elements

<! DOCTYPE html>