Запропонувати правкуПокращити цю статтюДопрацюйте відповідь до «Що таке content-box?». Ваші зміни проходять модерацію перед публікацією.Потрібне підтвердженняКонтентЩо ви змінюєте🇺🇸EN🇺🇦UAПереглядЗаголовок (UA)Коротка відповідь (UA)**`content-box`** - це типова модель `box-sizing`, за якої `width` і `height` застосовуються лише до області вмісту, а `padding` і `border` додаються до розмірів зверху. **Ключове:** через це фактичний розмір елемента виходить більшим за заданий `width`/`height`, наприклад 200px content + 40px padding + 10px border = 250px.Показується над повною відповіддю для швидкого нагадування.Відповідь (UA)Зображення`content-box`, це стандартна (типова) модель розрахунку ширини і висоти елемента в CSS. При `box-sizing: content-box;` властивості `width` і `height` застосовуються **лише до області вмісту (content)**, а `padding` і `border` додаються до розмірів зверху. Приклад: ```css div { box-sizing: content-box; width: 200px; padding: 20px; border: 5px solid; } ``` Фактична ширина блока буде: ```javascript 200 (content) + 20+20 (padding) + 5+5 (border) = 250px ``` Підсумок: при `content-box` елемент виходить більшим за заданий `width`/`height`, тому що внутрішня область рахується окремо від відступів і меж.Для рев’юераПримітка для модератора (необов’язково)Бачить лише модератор. Прискорює рев’ю.