Why isn't css :active class working in IE7

I have a set of buttons which have 3 CSS states attached: default, :hover and :active. Both the default and :hover states display correctly, but the :active state is 开发者_Python百科ignored in IE7.

I'm really not feeling a JavaScript fix and would like to avoid this if at all possible.

:hover works in IE 7. :active works in IE 7 only if applied to an <a/> element.

See the compatibility list here: http://www.quirksmode.org/css/contents.html

IE7.js should do the trick. Just use:

<!--[if lt IE 7]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE8.js"></script>
<![endif]-->

Subset of selectors it handles:

parent > child
adjacent + sibling
adjacent ~ sibling
.multiple.classes
:hover  Now applies to all elements
:first-child

It also fixes CSS properties, as well as png transparency. In addition, it is lightweight.

Are you setting the classes on a link element? If I remember correctly, IE7 doesn't recognize states such as hover and active on anything that is not a link.