Simple Rollover won't work IE

**ttmt** · Feb 13, 2010 08:14

Hi all

I have this simple rollover css that uses a image containing the over and out states - hovering over the link move the background.

http://www.ttmt.org.uk/rollover.html

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<title>untitled</title>
	<style type="text/css">
	   a:link, a:visited;{
	      height:50px;
	      width:120px;
	      display:block;
	      background:url("nav.gif")no-repeat top left;
	      text-indent:-1000em;
	   }
	   a:hover, a:active;{
	      background-position:bottom left;
	   }
	</style>
</head>

<body>
	<a href="#">Button</a>
</body>
</html>

It works in all browsers apart from any IE - the image dosen't show at all. Why dosen't work in IE, and whats the best way to do this.

Thanks for any help

**PicnicTutorials** · Feb 13, 2010 08:22

You didn't mention, so I'll assume your talking about IE6. This should fix it... http://www.visibilityinherit.com/cod...ahover-bug.php

**ttmt** · Feb 13, 2010 08:26

Thanks for the link -

My original code didn't work in any IE browsers

**PicnicTutorials** · Feb 13, 2010 08:37

try removing these...

a:link, a:visited;{
height:50px;
width:120px;
display:block;
background:url("nav.gif")no-repeat top left;
text-indent:-1000em;
}
a:hover, a:active;{
background-position:bottom left;
}

**ttmt** · Feb 13, 2010 08:39

They were typo's they weren't in the code

**RyanReese** · Feb 13, 2010 08:45

Hi, the problem is that there isn't a space between ) and no-repeat. IE will ignore the rule

Code:

background:url("nav.gif")no-repeat top left;

Add a space there

**PicnicTutorials** · Feb 13, 2010 08:48

This line needs to look like this (add the space)

background:url(nav.gif) no-repeat top left;

**ttmt** · Feb 13, 2010 08:50

Thanks RyanReese, working now

**RyanReese** · Feb 13, 2010 08:56

You'rewelcome

**PicnicTutorials** · Feb 13, 2010 09:12

Originally Posted by ttmt

Thanks RyanReese, working now

Hu-hm - hu-hm - Eric too - P's and Q's man

**ttmt** · Feb 13, 2010 09:20

Sorry, Thank you all - my original thank you must of been posted as you were posting Eric

User Tag List

Thread: Simple Rollover won't work IE

Thread Tools

Display

Simple Rollover won't work IE

Bookmarks

Bookmarks

Posting Permissions