CSS 하위 클래스 - div와 일치하는 CSS 규칙

Question

어떤 이유로 하위 클래스가 DIV 요소에서 작동하지 않습니까?

CSS 규칙은 span + a와 같은 인라인 태그와 일치하지만 div와는 일치하지 않습니다.

는 아래의 예를보고하십시오 :

<style> 

.row { 
    display: block; 
} 

.row .lbl { 
    float: left; 
    width: 200px; 
    text-align: right; 
    font-weight: bold; 
    background-color: blue; 
} 

.row .inpt { 
    float: left; 
    width: 200px; 
    text-align: right; 
    font-weight: bold; 
    background-color: red; 
} 


</style> 

작품!

<p class="row"> 

    <span class="lbl">Title</span> 
    <span class="inpt">Data</span> 

</p> 

!!! 당신의 div가 p의 자식이기 때문에

<p class="row"> 

    <div class="lbl">Title</div> 
    <div class="inpt">Data</div> 

</p> 

Answer 1

P 요소의 경우 w3.org는 P 요소가 인라인 요소 만 포함 할 수 있음을 나타내는 다음을 지정합니다.

<!ELEMENT P - O (%inline;)*   -- paragraph --> 

이

는 P 요소가 있다고하는 http://www.w3.org/TR/html401/struct/text.html#h-9.3.1과 일치 "(P 자체를 포함), 블록 레벨 요소를 포함 할 수 없습니다."

Answer 2

나는 믿는다. p을 div으로 변경하면 다시 작동합니다.