ie fix for span a:hover span

Hi craigtaylor74,
You need to make a change to something in the "A" on hover to get it to work in IE.
Try something like

#languages a{color:blue;} 
#languages a:hover{color:red;}

Hope that helps

sorry, I don't really understand. I`ve changed the code to add a color to a span but no difference (a:hover span already had a color!). Is this what you meant? Earlier in the code #languages a and #languages a:hover already had a color defined. I've pasted the whole lot:

#languages{
margin: 0px auto 5px auto;
position:relative;
background:#F9F7F2;
width:900px;
height:30px;
font: bold Arial, Helvetica, sans-serif;
}
#languages ul {
	margin: 2px 2px 2px 2px;
	padding: 0px;
	list-style-type: none;
}
#languages li {
margin: 0px 2px 0px 0px; padding: 0px;
float: left;
width: 80px;
text-align: center;
}
#languages a {
display: block;
width: 77px; padding: 4px;
text-decoration: none;
}
#languages a:link, #languages a:visited {
	color: #665531;
	background: #F9F7F2;
	font-size: 15px;
	font-weight: bold;
}
#languages a:hover {
color: #665531;
	background: #F9F7F2;
	font-size: 15px;
	font-weight: bold;
}
#languages a span {
color:#99FF00; background:#F9F7F2;
display: none;
}
#languages a:hover span {
color: #ffcc00; background:#F9F7F2;
font: 18px bold Arial, Helvetica, sans-serif;
display: block;
position: absolute; top: 0px; left: 200px; width: 350px;
margin: 2px 2px 2px 2px; padding: 4px;
text-align:left;
}
#language_uberlink a:link, #language_uberlink a:visited, #language_uberlink a:hover {
background: #F9F7F0;
font: 20px Arial, sans-serif; color: #F99000;
}

Hi craigtaylor74,
Not the span, you need to change someting in the link itself.

You need to specify a style for a:hover for the a:hover span to be recognised in IE.

#languages a:hover {background:#fff;}
#languages a:hover span { .......etc. }

The background color can be anything suitable.

Hi

Just as a bit of fun, I even put an imaginary style in once, and it worked! Literally like this:

#languages a:hover span {foo:bar}

Trevor

#languages a:hover {background:#fff;}
#languages a:hover span { .......etc. }

The background color can be anything suitable.

but haven't I done that already?

#languages a:hover {
color: #665531;
	background: #F9F7F2;
	font-size: 15px;
	font-weight: bold;
}
#languages a:hover span {
color: #ffcc00; background:#F9F7F2;
font: 18px bold Arial, Helvetica, sans-serif;
display: block;
position: absolute; top: 0px; left: 200px; width: 350px;
margin: 2px 2px 2px 2px; padding: 4px;
text-align:left;
}

sorry but I cannot see what it is that i haven`t done.

You have indeed, but the value of the background color has not changed between a:hover and a:hover span.

IE requires a change of color to work. Even a small change will do.

So
#languages a:hover { background: #F9F7F3; }
#languages a:hover span { background: #F9F7F2; }

and you will need to do the same with
#language_uberlink a:link, #language_uberlink a:visited, #language_uberlink a:hover {
where #language_uberlink a:hover will need a separate style.

I promise I`m not trying to annoy you ... but I`ve done what you say and see no difference.

#languages a:hover {
color: #665531;
	background: #F9F7F2;
	font-size: 15px;
	font-weight: bold;
}
#languages a:hover span {
color: #ffcc00; background:#00FF00;
font: 18px bold Arial, Helvetica, sans-serif;
display: block;
position: absolute; top: 0px; left: 200px; width: 350px;
margin: 2px 2px 2px 2px; padding: 4px;
text-align:left;
}

no need to answer as I've gotten to the bottom of it by starting with code that i know works and step by step changing it to what I had and thus found my error (most likely exactly what you were telling me)
Thanks,
Craig.

Hi, i had exactly the same problem and i also seemed to do everything right but afterwards i just try to put to #div a:hover {background:#fff;} and to #div a:hover span{background:#fffe;} ... simply the background property, nothin else seemed to work. But this does , thx people!

It seems like the original idea didn't get through. IE simply needs a special something to get going... like kicking your car to get it started down the hill.

thing {
styles;
}
thing:hover {
something extra special for IE;
}
thing:hover {
this is the actual hover code...
}

And I LOVE Trevor's answer, I never thought to try something imaginary before... I'm going to do it too!

It does NOT have to be a colour or a background. I was using
thing:hover {
visibility: visible;
}
earlier since it makes no stylistic changes. Apparently anything will do : )