Internet Explorer: Klickfehler bei transparenten Flächen

Will man im IE9 oder IE10 eine Klickfläche über andere Elemente (z.B. span) legen, erlebt man eine unschöne Überraschung. Die Fläche an sich ist wie erwartet klickbar, allerdings verhindern Elemente hinter der Fläche aus irgendeinem Grund, dass man genau an dieser Stelle klicken kann.

Man möge folgenden Code testen:

<div class="test">
	<span class="h1">Test</span>
	<span class="text">nochn Test</span>
	<a href="http://google.de">&nbsp;</a>
</div>

mit folgenden CSS:

.test {
	position: absolute;
	top: 20px;
	left: 20px;
	background: #eee;
	width: 500px;
	height: 500px;

}
.h1, .text {
	//z-index: 1;
	//position: relative;
}

.h1 {
	font-size: 20px;
	font-weight: bold;

}

a {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	//z-index: 2;
}

weder z-index noch position können daran etwas ändern.

Das Problem: aus irgendeinem unerfindlichen Grund benötigt der IE zwingend eine Hindergrundfarbe für die Fläche. will man diese transparent haben nutzt man einfach:

a { 
	background-color: rgba(255, 255, 255, 0.001);
}

Somit ist die Fläche „fast“ transparent und der Klick funktioniert.