To give a simple example, leaving the document flow is compared to when we moved to school when we were in school, we did not have our registered permanent residence and location in our hometown.
Not departing from the document flow is equivalent. Although we are gone, our household registration and location are still in the original household registration location.
The html page elements are similar, the elements that are not out of the document flow will be arranged and divided according to the original block-level elements and in-line elements.
The arrangement of elements out of the document flow is not restricted by the original division rules.
Leaving the document flow usually occurs with the positioning of the element.
Today we first understand the out of document flow
Let's talk about element positioning later
In this way, they can be understood together and used across.
1. Get out of the document flow
01. Float , after the float is set to left/right, the changed element will be out of the document flow. (But sometimes we want to set the float property, but don't want to make it out of the document flow, we will introduce it later)
Here to expand, float is sometimes not as good as display: flex. To sum up, I don’t use much
02. position , there are absolute and fixed out of the document flow.
2. Consequences of desulfurization document flow
After the element leaves the document flow, if the parent does not set the height and width, the parent will collapse. As shown
After an element leaves the document flow, its position is given to the elements that are not out of the document flow. As shown
The DOM operation remains unchanged after the element leaves the document flow.
3. Leaving the document flow is often due to the need for element positioning. The next article will discuss element positioning. There is a correlation between element positioning and element alignment.
