css layout box-sizing uses _html/css_WEB-ITnose

div{

box-sizing:border-box;

width:200px;

padding:20px;

border: 1px solid red;

}

This css means that the div width is 200px, the border is 1px, the left and right margins are 20px, and the time content width is Adaptive, it is 200-2-20*2=158px;

If the value of box-sizing is content-box, it means that the width of the content area is set, not the div box Width;

Browser compatibility:

ie8 and above support this attribute, firefox needs to add the browser manufacturer prefix -moz-, low version IOS and Android browsing You also need to add -webkit-

*,*:before,*:after{

-moz-box-sizing:border-box;

-webkit- box-sizing:border-box;

box-sizing:border-box;

}