Cita: "nuestro div tiene un ancho de 500px y luego nuestro margen interior o bien “relleno” (padding) que tiene 10px hace que nuestro div se le sumen 20px (10px por lado del div) mas de ancho y luego un borde decorativo de 1px por lado que igual se suman al tamaño de nuestro div, y por ultimo tenemos nuestro margen “exterior” que sirve para eso “separar” y tiene otros 10px por lado y se le suman de nuevo a nuestro div contenedor, que ahora ya no mide “width:500px” ahora mide “width:542px” y claro lo mismo ocurre con la altura…"
Lee bien... prueba y saca tus propias conclusiones nada cuesta intentar antes de preguntar.