PayneLess Designs - Link - Background Image

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<title>Link - Background Image</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<meta name="generator" content="HAPedit 3.1">
<style type="text/css">
#header {
width: 600px;
height: 120px;
margin: 0 auto;
background:
url(http://img186.imageshack.us/img186/4231/banpaynelessbyjonybdhl9.jpg) no-repeat center scroll;
}

#header a {
width: 600px;
height: 120px;
margin: 0 auto;
background: url(http://img186.imageshack.us/img186/4231/banpaynelessbyjonybdhl9.jpg) no-repeat center scroll;
display: block;
text-decoration: none;
}

#header a span {
visibility: hidden;
}
</style>
</head>
<body>
<p>As a last point, adding onfocus="this.blur()" into each link code will get rid of that annoying dotted line which appears when the link is clicked.</p>
<div id="header"><a href="http://mysite.com"><span>MySite.com</span></a></div>

<p><a href="http://xavisys.com/css-trick-turning-a-background-image-into-a-clickable-link/" title="">CSS Trick: Turning a background image into a clickable link</a></p>
</body></html>