Hallo.
Aufgrund mehrerer Forum-Beiträge habe ich jetzt angefangen, meinen Seitenaufbau mit CSS zu erstellen.
Aber leider funktioniert das noch nicht ganz so, wie ich mir das vorstelle. Ich poste mal einen Auszug aus meinem Quellcode mit, der im Internet Explorer genau so dargestellt wird, wie ich das möchte. Opera, Firefox und Netscape haben allerdings Probleme mit dem linken Navigationsmenü.
Die Navigation wird in IE untereinander dargestellt, während die Menüpunkte in den anderen Browsern nebeneinander angezeigt werden (die Hovereffekte und Links funktionieren auch nicht!).
Hat jemand eine Idee, was für einen Anfängerfehler(?) ich da gemacht habe?
Hier kommt der Quellcode:
<div style="position:absolute; text-align:center; left:10%; top:3%; width:80%; height:10%; z-index:8;">
<img style="height:100%;" alt="Meine Homepage" src="images/logo.jpg">
</div>
<div style="position:absolute; text-align:center; left:40%; top:4%; width:20%; height:8%; z-index:10; vertical-align:middle;">
<p style="font-size:16px; color:#000099; font-weight:bold;">MEINE HOMEPAGE</p>
</div>
<div style="position:absolute; left:3%; top:15%; width:95%; height:75%; z-index:5;">
<div style="margin-left:188px; background-color:#FFFFFF; z-index:2; text-align:right;">
<a class="navilink" href="index.php?Ziel=Aktuell">Aktuell</a> | <a class="navilink" href="index.php?Ziel=Kontakt">Kontakt</a> | <a class="navilink" href="index.php?Ziel=Sitemap">Sitemap</a> | <a class="navilink" href="index.php?Ziel=Suche">Suche</a>
</div>
</div>
<div style="position:absolute; left:3%; top:15%; width:170px; height:75%; background-color:#000099;
overflow:auto;">
<div style="text-align:center; margin-top:0px;">
<p style="width:100%; line-height:16px; background-color:#FFFFFF;"> </p>
<a href="index.php?Ziel=Websites" class="leftnavi">Websites</a><a href="index.php?Ziel=Privates" class="leftnavi">Privates</a><a href="index.php?Ziel=Galerie" class="leftnavi">Galerie</a><a href="index.php?Ziel=Guestbook" class="leftnavi">Gästebuch</a></div>
</div>
<div style="position:absolute; left:3%; top:15%; width:95%; height:75%; z-index:3;">
<div style="margin-left:188px; background-color:#000099; height:100%; overflow:auto; z-index:1; border-style:solid; border-color:midnightblue; border-width:1px;">
<br><h1>Meine Homepage</h1><p style="text-align:center;">Ich begrüße Sie recht herzlich auf meiner Homepage.</p>
<p style="text-align:center;"><img align="center" src="images/seiteninhalte/gengi.jpg" alt="Bild"></p>
<p style="text-align:center;">- Begruessungstext -</p></div>
</div>
<div style="position:absolute; left:3%; top:92%; width:95%; height:7%;">
<p align="center" style="color:#000099;">
Herzlich willkommen auf meiner Homepage.</p>
</div>