Only set text as link

Question

So when ever I wrap a header in an anchor I end up being able to click on the "side" of a link and it'll still work. I only want to be able to click the text, not surrounding area. Here's the code

<a href="#" id="link"><h1 class="out">Click here ----></h1></a>

And a demo. Any ideas? I wasn't really sure what to search for.

Answer 1

This should do it

<h1 class="out"><a href="#" id="link">Click here ----></a></h1>

Answer 2

Put the anchor inside the h1 if you only want the text clickable, not the entire block.

<h1 class="out"><a href="#" id="link">The reset link has already been used</a></h1>

http://jsfiddle.net/8weUA/1/