CSS Casing Ignored

Question

어떤 이유로 든 오른쪽 열의 추천 기사가 '#elementtext'및 '#elementtext : hover'속성을 무시하고 있습니다. 'p.element'및 'img.element'만 표시됩니다.

아이디어가 있으십니까?

감사합니다 - 타라

보너스 : 나는 또한 중앙에 떠하기 위해 'p.element'텍스트를 얻으려고 (수직 및 수평 - 왼쪽으로 정렬 된 상태)이 '#elementtext'상자에.

#elementtext { 
     height: 90px; 
     width: 150px; 
    margin-left: 1px; 
    background: #c3c3c3; 
    padding: 0px 10px 0px 5px; 
} 
p.element { 
     height: 85px; 
     width: 145px; 
    padding: 2.5px 2.5px 2.5px 2.5px; 
} 
#elementtext:hover{ 
    background:#ff9999; 
    cursor:pointer; 
} 

Answer 1

범위는 디스플레이 추가 당신이 태그를 넣을 수없는 인라인 요소이다 : 당신의 #elementtext에 블록을

이와같이

#elementtext { 
display:block; 
height: 90px; 
width: 150px; 
margin-left: 1px; 
background: #c3c3c3; 
padding: 0px 10px 0px 5px; 
} 

편집 나는 class = "elementtext"라고 생각합니다. 넣으십시오. 그것의 infront 아니다 #

.elementtext { 
display:block; 
height: 90px; 
width: 150px; 
margin-left: 1px; 
background: #c3c3c3; 
padding: 0px 10px 0px 5px; 
} 

Answer 2

소리가 나면 elementtext의 인스턴스가 여러 개 있습니다. 그렇다면이 클래스는 ID가 아니라 클래스 여야합니다. CSS ID는 페이지 전체에서 고유해야합니다.

다음 HTML보십시오 :

<span class="elementtext">Test</span> 

그리고 CSS :

.elementtext { 
    height: 90px; 
    width: 150px; 
    margin-left: 1px; 
    background: #c3c3c3; 
    padding: 0px 10px 0px 5px; 
} 
p.element { 
    height: 85px; 
    width: 145px; 
    padding: 2.5px 2.5px 2.5px 2.5px; 
} 
.elementtext:hover{ 
    background:#ff9999; 
    cursor:pointer; 
}