PDA

View Full Version : how do I make hover work in ie?



elli
11 Apr 2007, 08:05 PM
Is hover suppose to work in ie7? It is not working for me.
What could I add to this to get it to work in ie?


This is my code:

td.name
{
background: url(pic1.jpg) no-repeat;
}

td.name:hover
{
background: url(pic2.jpg) no-repeat;
}

Wickham
12 Apr 2007, 02:32 AM
It does work in IE7 and Firefox but probably not in IE6 which doesn't support the hover attribute except on a href.

I tested with a table and a div. It's best to give a width and height if you have no text in the td or div.

td.name and td.name:hover styles will also work with td but I had to leave out the td to get it to work with a div as well.



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html>
<head>
<meta name="keywords" content="Wickham"/>
<meta name="description" content="Test items"/>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1"/>
<title>Test</title>

<style type="text/css">
.name
{
background: url(orangew90x90.jpg) no-repeat;
}

.name:hover
{
background: url(greenw90x90.jpg) no-repeat;
}

</style>
</head>

<body>

<table width="90" height="90"><tr><td class="name">
</td></tr></table>

<div style="width: 90px; height: 90px;" class="name"></div>

</body>
</html>