Adding Rollover image to menu

Hi,

Just wondering if someone could help me. I’m fairly new to wordpress and I’m trying to add a menu with images, with a rollover image. I’ve been able to add the images, this is the code I’ve added in the stylesheet:

‘#menu-left a:hover {

background: url(“http://www.dogmosis.com/images/homeRollover.jpg”);
}

#menu-left a:visited:hover {
color: #ff0000;
text-decoration: none;
}
#menu-left a.rollover {
display: inline-block
width: 229px;
height: 22px;
text-decoration: none;
background: url(“http://www.dogmosis.com/images/home.jpg”);
}

#menu-left a.rollover:hover {
background-position: -88px 0;
background: url(“http://www.dogmosis.com/images/homeRollover.jpg”);
}

#menu-left .displace {
position: absolute;
left: -5000px;
}
‘

And then I added the following code to the sidebar:

‘ <ul class=”toolbar”>
<span class=”displace”>home</span>
<img src=”http://www.dogmosis.com/images/home.jpg&#8221; />

‘

The images are displaying on my site: http://dogmosis.com/wordpress/

but the rollover image is appearing behind the image and isn’t in the correct position? I’m not 100% if what I have added is correct, so any assistance on this would be greatly appreciated.

Thanks for your time.