Why doesn’t :hover work in IE?

Wed, Apr 5, 2006 @ 1:00 pm

You may have seen on other sites an effect whereby the background colour of a containing element changes colour when you hover over it. A look at their CSS might reveal something like div:hover or li:hover. This is also how a lot of CSS dropdown menus work too, by applying a :hover to a list item.

This all works fine in most browsers except IE which only supports :hover on pseudo classes, i.e. anchors (links). All other elements won’t natively support :hover in IE.

So how do they get it to work then? Answer: javascript. You can either write a specific script to add :hover behaviour to a particular element or you can use an .htc file like Peter Nederlof’s CSS hover which attaches :hover behaviours to any element.