The problem.

I'm using jQuery to create a hover effect when a user hovers over a div.
This is fine, as usual all browsers except IE do what I need of them.

Inside my divs I have some text and to get the whole div area to be the link I have simply placed an anchor (last in the div in html) and abs pos'd it, given it a z-index and displayed it as block so that it is now the whole div as a link.

But because of the text, IE is giving priority to the text (unhelpfully trying to be helpful) so when I hover the div, if I hover into the text area it is taking the hovered stated off of the div.

I'm not really sure how better to explain this. but I need to stop IE bringing the text to the front.

I've searched but not found a solution, probably because I'm not sure what I'm looking for.

Any help, or a point in the right direction would be really helpful and appreciated,


This happens in all versions of IE inc 9