Doch, ist es. Lies dir nochmal den Artikel zu z-index durch und beachte, wann z-index erst nutzbar wird.
Danke zunächst für die Antwort. Das Problem ist damit aber leider nicht gelöst. Ich hatte die Angabe z-index beim Image ergänzt, ohne die Angabe position ebenfalls zu ergänzen. Die Reihenfolge ist aber auch ganz ohne z-index bereits durch die Reihenfolge der Definition richtig. Das div liegt auf dem Image. Wenn ich nun in den überlappenden Bereich mit der Maus klicke, bekommt beim IE6 das img das Ereignis und beim FF3 das div. Letzteres halte ich für das richtige Verhalten (div liegt ja oben) und möchte ich in allen Browsern erreichen.
Man kann das Verhalten erreichen, wenn das div eine Hintergrundfarbe bekommt und die Transparenz auf 100% gestellt wird. In diesem Fall funktioniert es auch beim IE6. Das ist aber umständlich und um einen Rahmen zu haben benötigt man ein zweites div.
Gibt es einen anderen bzw. "richtigen" Weg?
<html>
<head>
<style type="text/css">
.bg {
position:absolute;
border:1px solid red;
cursor:move;
top:0px;left:0px;
width:80px;height:80px;
background-color:white;
filter:alpha(opacity=0); /* IE */
}
</style>
</head>
<body>
<img src="http://src.selfhtml.org/logo.gif" onclick="alert('img');"/>
<div class="bg" onclick="alert('div');"></div>
</div>
</body>
</html>