CSS – box-sizing property

box-sizing property determines how the sizing properties are applied. It can take 2 values content-box and border-box

content-box is the default value. Affects the content box of the element and padding and border are additional.

box-sizing property in css, <span>CSS – box-sizing property</span>, KandZ
box-sizing property in css, <span>CSS – box-sizing property</span>, KandZ
box-sizing property in css, <span>CSS – box-sizing property</span>, KandZ

The child divs have the half size, plus 10px the border. That is why the second child goes below. Div 150 px plus border 10 px both sides total 160 px

border-box – the sizing properties are used to set the whole size of the element

box-sizing property in css, <span>CSS – box-sizing property</span>, KandZ
box-sizing property in css, <span>CSS – box-sizing property</span>, KandZ

The divs have the half size 150 px, and the border width is 10 px both sides. But the total size of the element is still 150 px

THE END!!!

94270cookie-checkCSS – box-sizing propertyCSS – box-sizing property

Related posts

One Thought to “CSS – box-sizing property

Comments are closed.