Проблема расширения элементов при использовании внутреннего отступа padding возникает из-за того, что стандартная «коробчатая модель» не включает отступы и границы при расчётах ширины и высоты. 3 Поэтому элемент расширяется на величину отступа. 13
Чтобы избежать этого, необходимо задать элементу свойство box-sizing в значении border-box (по умолчанию оно в значении content-box). 14 Тогда вместо того, чтобы раздвигать границы элемента, будет сужаться область внутри него. 1
Также можно уменьшить размер элемента, если при задании отступа убавлять размер элемента на размер отступа. 2 Например, если размер элемента 100px, а отступа — 10px, то размер элемента будет 100+10=110px. 2