cding child padding sprawia, że ​​rysuje się po stronie rodzica

Stosowanie dopełnienia do elementów potomnych powoduje, że dziecko rysuje ponad granicami swojego rodzica. Czy możesz wyjaśnić, jaki rozmiar ma margines, dopełnienie i szerokość treści.

jeśli zwiększymy dopełnienie, dlaczego rodzic również nie zmieni rozmiaru do akumulacyjnego rozmiaru wszystkich potomków, uwzględniając również rozmiar dopełnienia potomnego.

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;
   }

Jakie są praktyki kodowania, które musimy rozważyć, aby rozwiązać ten problem?

Ok, mam wiele odpowiedzi, które działają. Czy ktoś może wyjaśnić obliczenie rozmiaru rodzica na podstawie elementów podrzędnych. jakie są cechy dziecka, które są brane pod uwagę przy obliczaniu rozmiaru rodziców. kiedy całe wypełnienie jest brane pod uwagę, gdy nie jest brane pod uwagę?

questionAnswers(5)

yourAnswerToTheQuestion