| Версия CSS | 3 |
| Применение | любые элементы |
| Значение (по умолчанию) | content-box |
| Значение inherit | Если установлено, наследуется родительское значение. |
Это свойство позволяет изменять правила расчёта размеров блока. По умолчанию размеры блока определяются суммой ширина контента + отступы + поля + бордюр, при этом ширина контента задаётся свойствами width и height. Однако это можно изменить и эти два свойства будут задавать размер блока, а не контента; для этого нужно применить свойство box-sizing, установив соответствующее значение (см. таблицу ниже).
| Значение | Действие |
| content-box | Width и height устанавливают ширину контента (применяется по умолчанию). |
| padding-box | Width и height указывают размеры блока, при этом включают в себя значения полей. |
| border-box | Width и height указывают размеры блока, при этом включают в себя значение полей и бордюров. |
Соблюдение указанных значений зависит от браузера пользователя; некоторые значения могут не работать.
Пример кода:
1 {
2 box-sizing: padding-box;
3 }