a nice way to use CSS defined images that uses CSS inheritance to make optional differences on mouseover and onclick

// HTML

<input type="image" title="Search" class="imgTextSearch" id="idle" onmouseover="this.id='over';" onmouseout="this.id='idle';" src="images/transp_pixel.gif" border="0" />


// CSS

.imgTextSearch
{
    background: url(images/menu_searchmovie.gif) center center;
	width: 71px;
	height: 28px;
	border:  none;
}
.imgTextSearch#over // not user friendly, but possible
{
    background: url(images/menu_searchmovie2.gif) center center;
}