Aloha!
Leider funktionieren beim
MSIE der Pkt. "Magdeburg" nicht (keine Hand beim Mouseover, kein klick möglich) und bei
OPERA 6.0 funktioniert keiner der vier Varianten.
Opera weigert sich bestimmt wegen des absolut unmöglichen CSS, das du definiert hast.
BODY {
position:absolute;
top:0mm;
Millimeter? Nagut, ist ja ohnehin "Null", also kein Grund zum Ausrasten. Es sei allerdings gesagt, dass Millimeter keine gute Einheit für die Bildschirmdarstellung ist. Nimm Pixel (px).
left:0mm;
Siehe oben.
color:#000000;
padding: 0,0,0,0;
Was'n das für eine Padding-Angabe? Entweder meinst du: 0px Padding rundherum. Dann nimm "padding:0px;". Oder du willst alle vier Randbereiche einzeln angeben. Dann nimm "padding: 0px 0px 0px 0px;".
margin: 0,0,0,0;
Siehe oben.
}
table {
position:absolute;
top:0mm;
Siehe oben.
left:0mm;
Siehe oben.
background-image:url(test-koordinaten-tabelle.gif);
border-width:0mm;
Siehe oben.
border-style:solid;
border-color:#000000;
padding: 0,0,0,0;
Siehe oben.
margin: 0,0,0,0;
Siehe oben.
width:420px;
height:420px;
}
td {
width:12px;
line-height:10pt;
pt ist auch eher eine Einheit wie mm - also zur Bildschirmdarstellung eher ungeeignet. Nimm entweder px oder relative Angaben wie % oder em.
}
img {
border-width:0mm;
Siehe oben.
border-style:solid;
border-color:#000000;
padding: 0,0,0,0;
Siehe oben.
margin: 0,0,0,0;
Siehe oben.
}
#erfurt {text-decoration: none;
position:absolute;
top:165pt;
Du willst _pixel_genau positionieren, nicht "punktgenau". Nimm px als Einheit.
left:165pt;
Siehe oben.
}
[...]
Gilt für alle Klassen und IDs, die du definiert hast.
<body>
<table border=0>
<!-- 1. und einzige zeile --><tr>
<!-- 1. und eizige spalte --><td width=420 height=420>
<a href="http://www.magdeburg.de" target="_blank"><div id=magdeburg><img src="lampe.gif"></div></a>
<span class="erfurt"><a href="http://www.erfurt.de" target="_blank"><img src="lampe.gif"></a></span>
<a href="http://www.dresden.de" target="_blank"><img src="lampe.gif" class="dresden"></a>
<a href="http://www.schwerin.de" target="_blank"><img src="lampe.gif" id="schwerin"></a>
</td></tr></table>
</body>
Frage: Warum packst du die absolut positionierten Layer noch in eine Tabelle rein? Ist sehr sinnlos und führt im Netscape 4 zu Fehlverhalten (ansonsten kann er das, was du vorhast, durchaus hinkriegen). Wenn du verschachtelt positionieren willst, verschachtele <div> ineinander.
Opera hat keine Abneigung gegen Links in Layern. Nur ordentlich müssen sie sein. Ich hatte mit <div><a href><img></a></div> immer Erfolg.
- Sven Rautenberg