✔ Anzeigeproblem: IE & Firefox

Status
Nicht offen für weitere Antworten.
5th Element

5th Element

Mitglied
Hallo,

also ich habe ein Porblem das nicht nur ich habe. Ich hab grad ne Homepage gebastelt. Der Code is ok. Aber es gibt unterschiede in der Darstellung zwischen IE und Firefox. Im Firefox sieht alles super aus (weil ich ja für den Firefox gemacht habe) hab dan mal aus langeweile mal die Webseite mit dem IE aufgerufen und da ist alles verschoben? An was könnte es liegen?
 
Hi,

ohne HTML- und CSS-Code lässt sich da momentan nicht viel zu sagen.

Das Thema wird dann mal vom "Internet"-Forum auf Verdacht ins "CSS"-Forum verschoben.
 
INDEX.PHP

PHP: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Schule f&uuml;r Kranke in Stuttgart</title>

<link rel="stylesheet" type="text/css" href="style.css">

</head>
<body>

<div id="box">
     <div id="header">
          <p class="shortnavi">
             <a href="inhalt.php?section=startseite" target="content">Startseite</a>
             |
             <a href="inhalt.php?section=timsis" target="content">Timsis</a>
             |
             <a href="inhalt.php?section=verein" target="content">F&ouml;rderverein</a>
             |
             <a href="inhalt.php?section=kontakt" target="content">Kontakt</a>
          </p>
     </div>
     <div id="bg">
          <p class="navi">
             <a href="inhalt.php?section=startseite" target="content"><img class="button" src="gfx/startseiteoff.jpg" onmouseover="src='gfx/startseiteon.jpg'" onmouseout="src='gfx/startseiteoff.jpg'" border="0"></a>
             <a href="inhalt.php?section=kontakt" target="content"><img class="button" src="gfx/kontaktoff.jpg" onmouseover="src='gfx/kontakton.jpg'" onmouseout="src='gfx/kontaktoff.jpg'" border="0"></a>
             <a href="inhalt.php?section=leitbild" target="content"><img class="button" src="gfx/leitbildoff.jpg" onmouseover="src='gfx/leitbildon.jpg'" onmouseout="src='gfx/leitbildoff.jpg'" border="0"></a>
             <a href="inhalt.php?section=geschichte" target="content"><img class="button" src="gfx/geschichteoff.jpg" onmouseover="src='gfx/geschichteon.jpg'" onmouseout="src='gfx/geschichteoff.jpg'" border="0"></a>
             <a href="inhalt.php?section=konzepte" target="content"><img class="button" src="gfx/konzepteoff.jpg" onmouseover="src='gfx/konzepteon.jpg'" onmouseout="src='gfx/konzepteoff.jpg'" border="0"></a>
             <a href="inhalt.php?section=aufgaben" target="content"><img class="button" src="gfx/aufgabenoff.jpg" onmouseover="src='gfx/aufgabenon.jpg'" onmouseout="src='gfx/aufgabenoff.jpg'" border="0"></a>
             <a href="inhalt.php?section=unterricht" target="content"><img class="button" src="gfx/unterrichtoff.jpg" onmouseover="src='gfx/unterrichton.jpg'" onmouseout="src='gfx/unterrichtoff.jpg'" border="0"></a>
             <a href="inhalt.php?section=bildungen" target="content"><img class="button" src="gfx/bildungenoff.jpg" onmouseover="src='gfx/bildungenon.jpg'" onmouseout="src='gfx/bildungenoff.jpg'" border="0"></a>
             <a href="inhalt.php?section=projekte" target="content"><img class="button" src="gfx/projekteoff.jpg" onmouseover="src='gfx/projekteon.jpg'" onmouseout="src='gfx/projekteoff.jpg'" border="0"></a>
             <a href="inhalt.php?section=verein" target="content"><img class="button" src="gfx/vereinoff.jpg" onmouseover="src='gfx/vereinon.jpg'" onmouseout="src='gfx/vereinoff.jpg'" border="0"></a>
             <a href="inhalt.php?section=sponsoren" target="content"><img class="button" src="gfx/sponsorenoff.jpg" onmouseover="src='gfx/sponsorenon.jpg'" onmouseout="src='gfx/sponsorenoff.jpg'" border="0"></a>
             <a href="inhalt.php?section=partner" target="content"><img class="button" src="gfx/partneroff.jpg" onmouseover="src='gfx/partneron.jpg'" onmouseout="src='gfx/partneroff.jpg'" border="0"></a>
             <a href="inhalt.php?section=kliniken" target="content"><img class="button" src="gfx/klinikenoff.jpg" onmouseover="src='gfx/klinikenon.jpg'" onmouseout="src='gfx/klinikenoff.jpg'" border="0"></a>
          </p>
          <p class="content">
             <iframe src="inhalt.php" width="415" height="355" name="content" frameborder="0" marginwidth="0" marginheight="0"></iframe>
          </p>
     </div>
     <div id="footer">

     </div>
</div>

</body>
</html>


STYLE.CSS
Code: 
body {
background-color:#ffffff;
color:#000000;
font-family: verdana;
font-size: 11px;
overflow:auto;
}

table {
border: 0;
color:#000000;
font-family: verdana;
font-size: 11px;
}


a:link{color:#000000;}
a:visited{color:#000000;}
a:hover{color:#0084ff;}
a:active{color:#0084ff;}
a {text-decoration:none;}

div#box {
position: absolute;
width: 650px;
left: 50%;
margin-left: -325px;
height: 600px;
top: 50%;
margin-top: -300px;
}

div#header {
height: 205px;
background: url(gfx/header.jpg);
}

div#bg {
height: 320px;
background: url(gfx/bg.jpg);
}

div#footer {
height: 65px;
background: url(gfx/footer.jpg);
}

.shortnavi {
position: absolute;
left: 365px;
top:  133px;
}

.content {
position: absolute;
left: 185px;
top: 175px;
}

.navi {
position: absolute;
left: 20px;
top: 175px;
}

img.button {
display:block;
}
 
Gibt es evtl. eine Online-Version der Seite, damit man auch die eingesetzten Grafiken zur Verfügung, und so als Anhaltspunkt hat?

Ansonsten kann ich derzeit im IE keine eklatanten Verschiebungen erkennen.
 
Erweiter mal das Stylesheet mit dieser Regel:

Code: 
* {
margin:0;
padding:0;
}
und korrigiere anschliessend den top-Wert für die Klasse .shortnavi von 133 auf 143px:

Code: 
.shortnavi {
position: absolute;
left: 365px;
top: 143px;
}
Ansonsten kann ich keine Darstellungsunterschiede in den beiden Browsern feststellen.
 
Du wirst es nicht glauben, aber bei mir auch, und das sogar in den anderen Browsern, wie z.B. Mozilla, Opera oder Sea Monkey. :-)
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück