.class : 호버가 파이어 폭스에서 작동하지 않습니까?

Question

그래서 난 일부 HTML이 :

<a class='clicktext'>...read more!</a> 

을 그리고 난 그것을주고 싶어 : 그래서, 호버 애니메이션 :

.clicktext{ 
} 
.clicktext:hover{ 
    text-decoration:underline; 
} 
.clicktext:active{ 
    text-decoration:none; 
} 

충분가도, 모질라 파이어 폭스 5에서 작동하지 않는, 말 Chrome과 Safari에서 완벽하게 작동하지만 그러나, 내가 그것을 변경하면

a{ 
} 
a:hover{ 
    text-decoration:underline; 
} 
a:active{ 
    text-decoration:none; 
} 

Mozilla Firefox 5에서 완벽하게 작동합니다! 나는이 온라인에 관련된 것을 찾아 낼 수 없었다.

. 물론, .click 텍스트가 아닌 내 스타일을 적용 할 수 있습니다. 문제는 가능한 한 태그 스타일이 아닌 클래스에 모든 스타일을 적용하는 제 규칙을 망칠 수 있다는 것입니다. 결국, 나는이 밑줄 붙는 것을 나타 내기를 원하지 않는 많은 다른 태그들을 가지고있다.

누군가가이 문제에 부딪 혔으며 아마도 멋진 해결책을 찾았습니까?

편집 :이 또한 당신은 당신에 HREF = "#"을 추가 할 필요가

.clicktext a:hover{...} 
a .clicktext:hover{...} 

Answer 1

나는 파이어 폭스 문제의이 종류를했고, 클래스 이름에 태그 이름을 추가하여 그것을 해결 : 예를 들어

내가 크롬에서 근무하는이 있었다하지만 파이어 폭스에서 :

.content .sidebar:hover{ 
    background-color: red; 
} 

및 이 같은 좀 더 구체적으로 지정하여 고정 :

div.content div.sidebar:hover{ 
    background-color: red; 
} 

Answer 2

작동하지 않습니다. : hover 메타 태그는 href 속성이 설정되도록 링크가 필요합니다.

Answer 3

http://jsfiddle.net/rE8xU/ 문제가 보이지 않습니다. 마우스 오버시 밑줄이 표시됩니다. 이 문제의 가능한 원인은 클래스의 중요도입니다. 식별 태그로 설정된 스타일은 모든 클래스 스타일 등을 대신합니다.

http://htmlhelp.com/reference/css/structure.html 체크 아웃 캐스 케이 딩 순서

마지막으로, CSS 파일이 제대로 연결되어 있고 또는 당신은뿐만 아니라 확인하기 위해 파이어 폭스를 사용할 수 내장되어 있는지 확인합니다.

Answer 4

사용 텍스트를 하이퍼 링크하는하지 않는 경우 <p></p> 태그입니다.

<p class='clicktext'>...read more!</p> 

다음으로 텍스트를 스타일 지정하기위한 것입니다. 내가 도움이

p.clicktext { 
color: #ccc; 
} 

p.clicktext:hover { 
text-decoration:underline; 
} 

희망은,이 정확한 코드로 jsfiddle 당신은 ID를 확인 할 수 있습니다 파이어 폭스 5에서 잘 작동하기 때문에)

Answer 5

, 당신이 당신의 CSS 어딘가에 충돌이 큰 기회가있다 hover-pseudoclass를 가진 선택기는이 스타일의 라인을 우회 할 수 있습니다.firebug으로 검사하여 css가 상속되었는지 확인하십시오.