Demostrando el modelo de caja

El modelo de caja CSS es esencialmente una caja que envuelve cada elemento HTML. Consiste en: bordes, relleno, márgenes y el contenido real.

320px (ancho) + 20px (relleno izquierdo + derecho) + 10px (borde izquierdo + derecho) + 0px (margen izquierdo + derecho) = 350px