The reason why the parent class clears the floating (clear the floating code and place it in CSS for easy calling), floating css

The reason why the parent class clears the floating (clear the floating code and place it in CSS for easy calling), floating css

Floating factors are often applied in the production of static Web pages. For example, to make block-level elements not exclusive to a row, float is often applied. However, the application will find that, after the subclass floating is set, the parent class is not cleared, which will cause the following problems:

1. the floating element will float with the parent container or the previously positioned element. The floating element will not be in the document flow, that is, it will no longer occupy the original position, and will affect the subsequent element or parent container..

2. The parent container automatically scales up normally, but the position of the child element is not retained after the child element is added with a floating value. The parent container will feel that it does not exist, so it will not scale up.

Therefore, when writing static Web pages, you must pay attention to the floating clearing problem. A piece of floating clearing code can be easily called:

. ClearFloat: after {

Content :'';

Display: block;

Height: 0;

Visibility: hidden;

}

. ClearFloat {

Zoom: 1;

}