Skip navigation
Tyssen Design — Brisbane Freelance Web Developer
(07) 3300 3303

Why doesn’t :hover work in IE?

By John Faulds /

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.

Update

As announced on the IEBlog, :hover will be enabled on all elements in IE7.