I have linked h2 elements in a billboard type display. I want the rollover effect to work if you rollover anywhere on the element even the background image. You can see it in action here.

HTML:
Code HTML4Strict:
<div id="billboard">
			<h2 id="ad_postframe"><a href="#" title="Post Frame">Post Frame</a></h2>
			<h2 id="ad_residential"><a href="#" title="Residential">Residential</a></h2>
			<h2 id="ad_archcomm"><a href="#" title="Architectural/Commercial">Architectural/Commercial</a></h2>
				<div class="clear">&nbsp;</div>
		</div>
CSS:
Code CSS:
#billboard {
	position: relative;
	margin: 2px;
	width: 838px;
	height: 323px;
	background: #FFF;
	border: 2px solid #333;
}
 
#billboard h2 {display: block;text-indent: -9000px}
 
#ad_postframe {
	position: relative;
	display: block;
	margin: 2px 0 2px 2px;
	float: left;
	width: 277px;
	height: 319px;
	background: url(../layout/billboard-postframe.jpg) no-repeat;
}
 
#ad_residential {
	position: relative;
	margin: 2px 2px 2px 2px;
	float: left;
	width: 277px;
	height: 319px;
	background: url(../layout/billboard-residential.jpg) no-repeat;
}
 
#ad_archcomm {
	position: relative;
	margin: 2px 2px 2px 0;
	float: right;
	width: 276px;
	height: 319px;
	background: url(../layout/billboard-archcomm.jpg) no-repeat;
}
 
#ad_postframe a:link, #ad_postframe a:visited, #ad_postframe a:hover, #ad_postframe a:active,
#ad_residential a:link, #ad_residential a:visited, #ad_residential a:hover, #ad_residential a:active,
#ad_archcomm a:link, #ad_archcomm a:visited, #ad_archcomm a:hover, #ad_archcomm a:active {
	margin: 0 0 0 10px;
	display: block;
	width: 40px;
	height: 319px;
	overflow: hidden;
	text-decoration: none;
	background-repeat: no-repeat;
}
 
#ad_postframe a {background: url(../layout/billboard-btn-postframe.png) no-repeat;}
#ad_postframe a:hover {background: url(../layout/billboard-btn-postframe-on.png) no-repeat;}
#ad_residential a {background: url(../layout/billboard-btn-residential.png) no-repeat;}
#ad_residential a:hover {background: url(../layout/billboard-btn-residential-on.png) no-repeat;}
#ad_archcomm a {background: url(../layout/billboard-btn-archcomm.png) no-repeat;}
#ad_archcomm a:hover {background: url(../layout/billboard-btn-archcomm-on.png) no-repeat;}