CODEWITHSUNDEEP
htmlcsshaslayout
Sabrina Leggett
Sabrina Leggett

Reputation: 9495

In IE only text part of link is clickable

I just noticed that in IE9 and IE8 (not in IE7) the padding around my links is not being considered part of the link (it's not clickable and my hover effects aren't being applied when it's hovered over). Only the text part of the link is working.

I tried giving the element a background color but that didn't fix it.

Has anyone seen this before?

SOLVED: Wrote a huge edit to my question and in the process figured it out myself. I had a negative z-index on the body, which I definitely didn't know would cause this but apparently it does. Here's the jsfiddle: http://jsfiddle.net/CEbMe/ which shows the problem in IE9 and IE8

Upvotes: 2

Views: 1775

Answers (2)

Andy
Andy

Reputation: 11

None of the suggested answers fixed it for me, and I spent a few hours finding the answer:

http://haslayout.net/css/Partial-Click-Bug-v2

background-image: url(#);

fixes it. I imagine this would probably do the job too:

background-color: transparent;

Upvotes: 1

user1340762
user1340762

Reputation:

Try adding:

<style>
  a { display: inline-block; padding: 0 50px; background: yellow; }
</style>
<p>This is a <a href="#">link</a> with some text around it</p>

Upvotes: 1

Related Questions