CODEWITHSUNDEEP
htmlcss
user1978104
user1978104

Reputation:

hover not working in span

In my code. I am displaying title in anchor <a> tag and author name inside anchor in span tag. I write code for hover on anchor tag when hover on span it is working fine , but when hover on <a> it is only change hover effect on anchor tag and not change color for span.

HTML :- 

<a href "#" class="link">
This is my link title 
<span class="span-text">Author Name</span>
</a>

Css :- 

span {
 color: #ccc;
}
a {
  color: #000;
  display: inline-block;
}
a:hover, span:hover {
 color:#9A1A4A;
}

fiddle here

Upvotes: 14

Views: 66691

Answers (3)

Falguni Panchal
Falguni Panchal

Reputation: 8981

please try this

http://jsfiddle.net/roop1886/2cEYc/

css :

span {
 color: #ccc;
}
a {
  color: #000;
  display: inline-block;
}


 a:hover, a:hover span {
    color:#9A1A4A;
}

Upvotes: 0

C3roe
C3roe

Reputation: 96363

!important is yuck, and not needed here.

a:hover, a:hover span {
 color:#9A1A4A;
}

Upvotes: 0

Fabrizio Calderan
Fabrizio Calderan

Reputation: 123397

Use instead 

a:hover, a:hover span {
    color: #9A1A4A;
}

Fiddle: http://jsfiddle.net/ySu3w/

Upvotes: 24

Related Questions