I have made an unholy mess of trying to create a rollover with css instead of using Dreamweaver.



css:


the margin-left:145px; is so that it clears what's on the left, and surprisingly, I've got that correct because the page is displaying okay with that.

What am I doing wrong this time?? The image won't load either.

I'm sure that is incorrect now that I look at it again.

The alt attributes appear, but I can't even get the images to load! I've tried it without the single quote too. Please can someone help me again?

Test Website


Sorry and Thanks in advance. I've asked that this be moved to the correct section. I am just so sorry about this.

This post has been edited by Popje: Apr 8 2008, 09:26 PM

images/backblk.gif does not exist. images/backred.gif does so you must have forgotten to upload the other.

.backnavbutton a means an <a> tag within the .backnavbutton class. But you have the class backnavbutton declared on the <a> so it is not picking up the css. You can use either

a.backnavbutton
a:hover.backnavbutton

which mean class backnavbutton declared on an <a> tag

or

#backnavigation a
#backnavigation a:hover

which means <a> tag within id backnavigation.

Also you do not need the <img> tag since you have the images defined as background images on <a> in the css.

I would use
<div id="backnavigation"><a href="java script:history.go(-1)" >Back</a></div>

with
#backnavigation a

I would also remove the "Back" from the image and overlay the <a> text on the background image.

I tried that and showed the person who wants the rollover, and they didn't like it! No taste!

Thanks for your help with this, I can use it on my own stuff instead!