Skip to content

Tyssen Design — Brisbane Tyssen Design logo

[email protected] (07) 3300 3303

Why doesn’t :hover work in IE?

By /

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.

Like to say hello? Give us a call on (07) 3300 3303, send us an email to enquiries@tyssendesign.com.au, or a message by filling in the form below.