Para image rollover con css yo siempre uso este codigo:
Cita: <style type="text/css">
#link{
width:100px;
height:100px;
display:block;
background:url(rollover-image.jpg) no-repeat 0 0;
}
#link:hover
{
background-position: 0 -100px;
}
#link span
{
display: none;
}
</style>
</head>
<body>
<a href=" " id="link" title="1234"><span></span></a>
</body>
</html>
Y en este caso la imagen es una sola pero solo muestro una parte de ella, cuando hago rollover con el mouse muestro la otra parte de la imagen.