Aplicar relleno a elementos secundarios es hacer que el niño dibuje más allá de los límites de su padre que lo contiene. ¿Puede explicar la consideración de tamaño en el margen, el relleno y el ancho del contenido?

si aumentamos el relleno, ¿por qué el padre tampoco cambia el tamaño al tamaño acumulativo de todos los niños teniendo en cuenta el tamaño del relleno también?

http://jsfiddle.net/NkXUW/4/

 <div>
       <ul>
          <li><a>srikanth</a>
           </li>
           <li><a>sunkist</a>
        </li>
        <li><a>sunday</a>
        </li>
    </ul>
    </div>



div {
     margin-top:90px;
    margin-left:90px;
    background-color:#676896;
   }
   ul {
     list-style-type:none;
   }
    ul li {
    display:inline-block;
   }
   a {
    background-color:#c34567;
    padding:10px 10px 10px 10px;
   }

¿Cuáles son las prácticas de codificación que debemos considerar para superar este problema?

Ok chicos, tengo muchas respuestas que funcionan. ¿Alguien puede explicar el cálculo del tamaño del padre basado en elementos hijos? ¿Cuáles son las características del niño que se consideran al calcular el tamaño del padre que abarca? ¿Cuando se considera todo el relleno cuando no se considera?