css-only rollover background image swap problem -- help?

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

Threaded View
I wanted to do something that looked interesting, for a spoken-word
artist's site.... I wanted the navigation background image appear to
change with a rollover, and I wanted to do it with CSS.

The following works as intended in Firefox, but breaks in IE and Opera
-- so it's obviously not going to be a valid effect if I can't coax
the code to accept the other browsers.


When the rollover image in the *span* tag is not a background, it
works in all the browsers I've been able to test. This site of mine
works fine with a very similar technique:

Anyone with an idea why it's breaking?

Thanks for any input...

e l a i n e   a t   d y k e t e c h   d o t   c o m

Re: css-only rollover background image swap problem -- help?

Miselaineous wrote:
Quoted text here. Click to load it

This imported stylesheet for http://ivanecoyote.com/test.php has a
number of 'odd' elements.

HTML comments <!-- ... --> are not allowed in a stylesheet but should be
/* ... */, I believe they are allow in HTML documents between the
<STYLE></STYLE> to hide the code from very old browsers

You have HTML <STYLE></STYLE> in your external stylesheet also a no-no

and not sure what this stuff is?

<!--[if lt IE 6]>
<style type="text/css" media="screen">>
/* HR styles need for IE 5/Win and under. */
#middle { position: relative; }

these special MS conditional comments are for in your HTML document not
your stylesheet, right?

Take care,

Site Timeline