Layout (CSS)

Understanding box

Inner content width: border + padding + width (if there is no margin, when the inner content exceeds the outer containerSacrifice outter padding,Use overflow control)

Inner containner width:Margin+ Border + padding + width (if there is a margin, when the inner containner exceeds the outer containerSacriice innerMagrin,Use overflow control)

 

 

Verticle margin collapse:( When no padding or border organizes two elements or two divs each contain a P structure, they margin touch each other, collapse margin ,)

1: When there are twoSame LevelWhen the elements overlap up and down, use the two largest margin as the margin between them, for example, p {margin: 10px; margin-top: 20px}. The result of the coincidence is that 20 PX margin is null between two p.

------>