Button:hover Not Working In Ie 11 Compatibility Mode
I'm trying to add hover effect to button tag. But it doesn't work in IE 11 (compatibility mode). I'm unable to find any reference of why it doesn't work. What can be the workaround
Solution 1:
Microsoft introduced compatibility mode in IE8 to emulate quirks and errors of old IEs for legacy apps.
One of these quirks is/was that :hover
pseudoclass works only on links (<a href=…>
tags):
.foo {
color: pink;
}
.foo:hover {
color: hotpink;
}
<aclass="foo"href="https://stackoverflow.com/">Stackoverflow</a>
will change color on hover, but
<buttonclass="foo">Stackoverflow</button>
will stay the same
Browser support for :hover
on MDN:
One possible solution would be to use <a>
with onClick
to emulate the button behavior:
<aclass="foo"href="#"onclick="doSomething(); return false;">Do something</a>
Or… just don't worry about it, i think that nobody expects fancy buttons in an app that needs IE7 rendering in 2018. ;)
Post a Comment for "Button:hover Not Working In Ie 11 Compatibility Mode"