What box-sizing does

Posted on in

box-sizing specifies the part of an element's CSS box, to which the properties width, min-width, max-width, height, min-height, max-height apply.


p {
    height: 3rem; 
    box-sizing: content-box;
}
Result: brown content box is 3rem tall

p {
    height: 3rem; 
    box-sizing: border-box;
}
Result: black border box is 3rem tall

Post author's photo Written by Jayesh Bhoot