IE6 hover & background image problem

[toad78]

I have a menu that uses a background image. IE6 does not display the link with the correct image. It only displays it with the visited image. Also, in IE6, it doesn't change the background image when hovered. What am I doing wrong?

 

I've been working on this all day and still can't make sense of it.

 

Thank you for taking the time to look into this for me!

 

    
<?php include('incl/top-left-nav-menu.php'); ?>


wvgs home
wvgs staff
wvgs office
about wvgs
contact home

 

#column-left {
   float:left;
   display: inline;
   width:229px;
   margin-right: -3px;
   }

#nav, #nav ul {
   font: 14px "Lucida Grande", Tahoma, sans-serif;
   margin: 0px 0px 10px 0px;
   padding: 0px;
   width: 229px;
   list-style: none;
}

/*\*/ * html #nav ul {
position: relative;
}/**/

#nav li { 
   position: relative;
   display: block;
   margin: 0px;
   padding: 10px 0px;
   background:url(../images/buttons/liborder.gif) center left no-repeat;
   }

#nav li a {
   color: #548AA7;
   text-transform: uppercase;
   text-decoration: none;
   letter-spacing: 2px;
   padding: 3px 0px 5px 54px;
   }

#nav li a:hover {    
   background: url(../images/buttons/liborder2.gif) center left no-repeat;
   color: #548AA7;
}

#nav li a:visited {
   background:url(../images/buttons/liborder3.gif) center left no-repeat;
   }

body.home #nav #nav_home, body.home #nav #nav_home a, body.staff #nav #nav_staff, body.staff #nav #nav_staff a, body.office #nav #nav_office, body.office #nav #nav_office a, body.about #nav #nav_about, body.about #nav #nav_about a,  body.contact #nav #nav_contact, body.contact #nav #nav_contact a {
   background: #e3e3e3;
   color: #000;
}

Edited January 7, 2009 by toad78

[shelfimage]

I'd have to see the site to see what is happening. But if using a background image that doesn't repeat, you may need to specify a height and width for IE6.

[toad78]

It was the width!

 

Thank you!

toad78