mehr informationen
<!-- HTML-Code-->
<div id="rollOverDemo">
	<a href="#wrap" title="mehr informationen">mehr informationen</a>
</div>

/* CSS-Code */
div#rollOverDemo a {
	text-indent:-1000px; /* text wegmachen */
	display:block;
	height:115px;
	width:240px;
	background-image: url(rolloverButton.gif);
	overflow:hidden;
}

div#rollOverDemo a:hover, 
div#rollOverDemo a:active, 
div#rollOverDemo a:focus {
	background-image: url(rolloverButton.gif);
	background-position: 0 -120px; /* position verschieben */
}

verwendete grafik

abstand zwischen den beiden zuständen beträgt exakt 120px…