Links and Transparent PNGs

If you've ever created a link and realized that, for some reason, you can only click the text within the link??? Even though you have everything within standards, and the link is being 'displayed' (using css: display:block) as a block level element, it STILL ONLY ALLOWS YOU TO ACTUALLY CLICK THE TEXT?! (Side note- this AS USUAL is only an issue with Internet Explorer.)

I have come across this a few times, and this time I had no choice but to find a solution. Thankfully, i found the magic search words (this i find is the hardest part of all - usually when you encounter an issue, the solution is posted somewhere, the true mastery is nailing down the exact search phrase that will yield the answer to your problem, almost a game of aiming your words perfectly. This time the solution was "Transparent png links" thanks to google, and of course the author of that page).

Anyways The solution:

All you need to do is define a position:relative on your link! then, magically, it works:
Html Code:

<ul>
<li><a href="website-design.php">
<div class="divAsLink" id="website_design"> </div>
</a>
</li>
</ul>

CSS:

.subnav a{
display:block;
position:relative;}