absolute positioned anchor tag (with no text) not clickable in IE

Question

I have two anchors positioned absolute on top of an image, the links are clickable in other browsers (Chrome, FF, Safari) but not in IE (tested in 8 & 9 so far)

Answer 1

You can do it using the mentioned background-image trick. When you do not want to use a transparent image for this, just use an unknown scheme or about:blank in the image URL.

a { background-image: url("iehack:///"); }

or

a { background-image: url("about:blank"); }

This works at least in IE 8 + 9 (the only IEs I tested) and in current versions of Firefox and Chrome. It is still valid CSS and causes no additional traffic. The first "hack" may give a JS error in Chrome (and maybe others) when using jquery. The latter only (but surely) gives a MIME-Type warning in Chrome due to the wrong MIME-Type of the about:blank document.