Basically I need help with something that should be very simple but isn't! I have a CSS image rollover code, and i am planning on having different rollovers next to each other, but for some reason they only go on top of each other rather then going next to each other. Can any one help me work this out? It is for a myspace therefore i can't use JS. Here is the code for one rollover.
<style>
a.josh {
background:url(http://img43.imageshack.us/img43/8420/mirrorsjosh.gif) repeat 0px 0px;
width: 160px;
height: 221px;
display: block;
}
a.josh span {
display: none;
}
a.josh:hover {
background: url(http://img198.imageshack.us/img198/1851/mirrorsjoshrollover.gif) repeat 0px -221px;
}
</style>
<a href="http://www.msplinks.com/MDFodHRwOi8vdHdpdHRlci5jb20vUmVsZW50bGVzc0pvc2g=" class="josh">
<span>Josh</span>
</a>