Разница между аддитивной и вычитающей системами добавления границ в CSS заключается в том, как вычисляются размеры элемента. 2
Аддитивная система предполагает, что размер элемента начинается со свойств width и height, а затем к ним добавляются значения свойств padding, border или margin. 2 Например, если установить для width 400 пикселей, затем добавить 20 пикселей padding и border 10 пикселей на каждой стороне, фактическая полная ширина элемента станет 460 пикселей. 2
Вычитающая система предполагает, что область холста, предназначенная для контента, равна: availablecanvas - margin - padding - border. 1 В этом уравнении availablecanvas (доступный холст) — дискретное значение, минус величина полей, границ и заполнения. 1