CODEWITHSUNDEEP
htmlcss
bartc
bartc

Reputation: 123

:hover works but rest of the link states don`t (:link & :visited for example)

For unknown to me reason, for a div with "TWO" inside:

:hover state works fine :link, :visited don`t work

I can't find why? 

.menu:link {
  color: teal;
}

.menu:visited {
  color: red;
}

.menu:hover {
  color: yellow;
}
<div>
  <a>
    <div class="menu">ONE</div>
  </a>
  <a href="smth.html">
    <div class="menu">TWO</div>
  </a>
</div>

Upvotes: 1

Views: 78

Answers (1)

kyun
kyun

Reputation: 10264

:visited and :link selectors are used with <a> tag. 

a:visited > .menu{
  color: red;
}
a:link > .menu {
  color: teal;
}
a:hover > .menu {
  color: yellow;
}
<div>
  <a>
    <span class="menu">ONE</span>
  </a>
  <a href="https://stackoverflow.com" target="_blank">
    <span class="menu">TWO</span>
  </a>
</div>

by the way, I don't think it is a good idea, to use div inside a

Upvotes: 2

Related Questions