Search code examples
cssmousehover

mouse hover on the span doesn't work

Suppose to have this html:

<a href="" class="hoverelement"><span>DOG</span></a>

I need to increase size of string "DOG" So I use this css:

.hoverelement span:hover {
  font-size:20px;
}

But this does not work? Can anyone help me?

Solution

  • You need to add !important in span's css, because it may be inherited by it's parent's rule.

    .hoverelement span:hover {
  font-size:20px !important;
}
    <a href="" class="hoverelement"><span>DOG</span></a>