Es en verdad una ecuación matemática muuuuy sencilla
Si quieres una caja de 500px:
padding:10px;width:480px; [ (10x2)+480 = 500 ]
padding:20px;width:460px; [ (20x2)+460 = 500 ]
Como verás, no tiene gran ciencia en verdad, y te ayuda a preservar el tamaño del contenido, independiente del padding; ¡Algo muy importante cuando manejas imágenes!
Claro, que si quieres que un contenido siempre tenga cierto ancho, y agregar el padding (Muy útil para contenidos dinámicos y aplicaciones web), puedes usar un doble divisor, aunque no lo recomiendo mucho para contenido estático, ya que es crear más divisores sin necesidad...
<div class="contenedor"><div class="contenido">Lorem Ipsum...</div></div>
.contenedor{width:500px}
.contenido{padding:10px}
El contenedor será siempre 500px. Suerte
