Muchas gracias, Mikmoro, el código revisado funciona muy bien

. Lo que me planteo ahora es lo siguiente: por un lado, distanciar el minibox del borde esterno del contenido (del contenedor); esto es que tomando como referencia el resultado visual de ese código, se vea un poquillo de color verde del contenedor entre el rojo del body y el marrón del borde del minibox.
También se me ocurre otra cosa: si quiero poner cuatro minibox dentro del contenedor verde, por ejemplo dos arriba y dos más abajo, todos equidistantes entre sí ¿qué debo hacer? ¿Usar el atributo
class para diferenciarlos de acuerdo a su posición? ¿Determinar simplemente un posicionamiento para el minibox ya existente y repetir ese código, recurriendo a
<span style> para variar ese posicionamiento en cada uno de los otros tres?