box-sizing

box-sizing

box-sizing The default value of is content-box
Indicates that the area to be rendered by this element is ：
Own width and height +padding Distance of +margin Distance of

If the setting is ：border-box
Indicates that the area to be rendered by this element is the specified width and height ,
Set up padding and margin Will be set within the set width and height

If we use border-box,child Width use 100%, Will compress the width
If we use border-box,child Width use 100px, Will not be compressed , After rendering the components , There is no space left to draw padding 了