CSS Box-Sizing Property

Published: 17 March 2020
on channel: A shot of code
1,103
71

In this tutorial we look at the Css Box Sizing property and how it allows us to have more control over how elements are sized. By default this is set to 'content-box' which is not something that we really want as it means any changes to the border on an element will cause a size change and may affect the layout of the page. To resolve this we set the Box-Sizing property to be 'border-box' and this means any width we apply to an element will include the size of the borders in its calculations.

We also look at how to apply this change to all elements via the * CSS selector:

{
box-sizing: border-box;
}


Watch video CSS Box-Sizing Property online without registration, duration hours minute second in high quality. This video was added by user A shot of code 17 March 2020, don't forget to share it with your friends and acquaintances, it has been viewed on our site 1,10 once and liked it 7 people.