I am using the text-indent technique to replace my h1 tag with my website's image as so:
<h1 title="Homepage">My logo</h1>
#header h1 {
float: left;
background: transparent url('../images/logo.png');
width: 214px;
height: 64px;
text-indent: -9999px;
}
The only problem is that I want to still have the new image act as a hyperlink. I tried doing:
<h1 title="Homepage"><a href="#">My logo</a></h1>
But since it is being indented, the link is too. I wanted to know if anyone had any suggestions on how to do this and still be valid XHTML.
EDIT I'd rather do it in a way that is accessible to users with screen readers, from what I read, doing a display:none will not work with some readers.