Hallo!
Ich habe einen Link. Wenn jemand auf diesen Link klickt, dann sollten 3 Grafiken (100px - 600px - 100px) in einem 800px großen div erscheinen. Ich mache das mit Display:none. Damit die Grafiken nebeneinander bleiben habe ich ihnen jeweils das entsprechende float: gegeben.
Aber jedesmal, wenn auf diesen Link geklickt wird rutscht die rechte Grafik nach unten und bleibt nicht neben der mittleren. Ich habe keine Ahnung woran das liegt.
Hier noch der Quelltext:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Image Map</title>
<link rel="STYLESHEET" type="text/css" href="css.css">
<script type="text/javascript">
function Berge_show() {
document.getElementById("border_left").style.display = "block";
document.getElementById("border_right").style.display = "block";
document.getElementById("middle").style.display = "block";
}
</script>
</head>
<body>
<p id="galerie">
<div id="nav"><a href="#" onclick="Berge_show()"><img src="berge.png" alt="Berge" width="98" height="40" style="border-style:none;" id="Berge"></a></div>
<div id="content">
<span style="float:left;"><img src="border.png" id="border_left" width="100" height="544" alt="border_left" style="border:none; display:none;"></span>
<span style="float:none;"><img src="middle.png" id="middle" width="601" height="544" alt="middle" style="border:none; display:none;"></span>
<span style="float:right;"><img src="border.png" id="border_right" width="99" height="544" alt="border_right" style="border:none; display:none;"></span>
</div>
</p>
</body>
</html>