• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Problem zwischen Mozilla und Internet Explorer

moepf21

Neues Mitglied
hallo zusammen,
ich bin ganz neu hier....genauso neu bin ich gerade dabei eine homepage it einigen freunden zu designen.(alles eher neulinge)
wir haben uns erst mal eine startseite zurecht gelegt...
das problem ist, beim i-net explorer funktioniert alles, jedoch bei mozilla funktioniert das menü nicht und nicht alle bilder sind an dem ort wo sie hin sollten

hier der code:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>TSV Weißenbrunn</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta name="robots" content="index,follow">
<meta name="description" content= Die Homepage der 1.Mannschaft des TSV Weißenbrunn 1911 e.V.>
<meta name="keywords" content=TSV Weißenbrunn,Weissenbrunn,Fußball,1.Mannschaft,TSV Weissenbrunn>
<meta name="language" content="de">
<link rel="stylesheet" type="text/css" media="screen, projection" href="stylesheet.css">
<link rel="shortcut icon" href="favicon.ico">
</head>

<center><img src=banner.jpg ></center>

<marquee><font size="36" face="Verdana">Herzlich Willkommen!</font></marquee>
<p></p>


<style type="text/css">                                                       
 <!--
 A.menulink {
        display: block;
        width: 180px;
        text-align: center;
        text-decoration: none;
        font-family: Verdana;
        font-size: 20px;
        color: #FFFFFF;
        background-color: #FF0000;
        border-style: solid;
        border-width: 2px;
        border-color: #000000;
 }

 A.menulink:hover {
        border-style: solid;
        border-width: 2px;
        border-color: #white;
        color: #000000;
        background-color: #F0E1FF;
 }
 -->
</style>

<table border="0" width="110" align="left">
  <tr>
    <td><a href="index.html" class="menulink">&nbsp;Startseite</a></td>
  </tr>
  <tr>
    <td><a href="aktuelles.html" class="menulink">&nbsp;Aktuelles</a></td>
  </tr>
  <tr>
    <td><a href="spielplan.html" class="menulink">&nbsp;Spielplan 2008/09</a></td>
  </tr>
  <tr>
    <td><a href="spieler.html" class="menulink">&nbsp;Spieler</a></td>
  </tr>
  <tr>
    <td><a href="gelaende.html" class="menulink">&nbsp;Sportgelände</a></td>
  </tr>
  <tr>
    <td><a href="chronik.html" class="menulink">&nbsp;Vereinschronik</a></td>
  </tr>
  <tr>
    <td><a href="bilder.html" class="menulink">&nbsp;Bilder</a></td>
  </tr>
  <tr>
    <td><a href="gaestebuch.html" class="menulink">&nbsp;Gästebuch</a></td>
  </tr>
  <tr>
    <td><a href="links.html" class="menulink">&nbsp;Links</a></td>
  </tr>
  <tr>
    <td><a href="impressum.html" class="menulink">&nbsp;Impressum</a></td>
  </tr>
  <tr>
    <td><a href="kontakt.html" class="menulink">&nbsp;Kontakt</a></td>
  </tr>
</table>

<div style="position: relative; width: 726px; height: 401px; z-index: 1; left: 77px; top: 3px" id="Ebene1">
<img border="0" src="team.jpg" width="726" height="401"></div>







<p></p>

<div style="position: absolute; width: 145px; height: 145px; z-index: 1; left: 1065px; top: 545px" id="Ebene1">
<center>
 <font size=5px><b><u>WM 2010 in Südafrika:</u></b></font><p></p>
 <SPAN id=c1 style="FONT: bold 30px arial; COLOR: black;"></SPAN><br>
 <SPAN id=c2 style="FONT: bold 25px arial; COLOR: red;">;</SPAN><br>
 <small>  h / min / sec </small>

<script type='text/javascript'>
// Erstellt mit dem Countdown-Generator - Homepage-Total.de
var end = new Date('June 11, 2010 00:00:00');
function toSt2(n) {
  s = '';
  if (n < 10) s += '0';
  return (s + n).toString();
}
function toSt3(n) {
  s = '';
  if (n < 10) s += '00';
  else if (n < 100) s += '0';
  return (s + n).toString();
}
function countdown() {
  d = new Date();
  count = Math.floor(end.getTime() - d.getTime());
  if(count > 0) {
    miliseconds = toSt3(count%1000); count = Math.floor(count/1000);
    seconds = toSt2(count%60); count = Math.floor(count/60);
    minutes = toSt2(count%60); count = Math.floor(count/60);
    hours = toSt2(count%24); count = Math.floor(count/24);
    days = count;
    document.getElementById('c1').innerHTML = days + ' TAGE';
    document.getElementById('c2').innerHTML = hours + ':' + minutes + ':' + seconds
    setTimeout('countdown()', 100);
  }
}
countdown();
</script>
</div>


<p></p>

<font size=4px><i> Besucherzähler:</i></font><p></p>
<a href="http://www.andyhoppe.com/" title="Counter"><img src="http://www.andyhoppe.com/count/?id=1237484779" style="border:none" alt="Counter" /></a></center>
<p></p>


<div style="position: absolute; width: 200px; height: 200px; z-index: 1; left: 1077px; top: 290px" id="Ebene1">
<a href="http://www.wetter24.de/" target="_blank" title="Wetter24: Ihr Wetter-Dienst"><img src="http://www.wetter24.de/meteo/hptool/logo_wetter24.png" alt="" width="120" height="32" border="0"></a><br/><div style="background-color:#0060ac;color:#ffffff;font-family:Tahoma,Arial,Verdana,Times New Roman;font-weight:bold;font-size:10px;;width:120px;text-align:center"><a href="http://www.wetter24.de/de/home/wetter/weltwetter/ortewetter/stadt/49X9141/weicenbrunn.html?cityID=49X9141" target="_blank" style="color:#ffffff;font-family:Tahoma,Arial,Verdana,Times New Roman;font-weight:bold;font-size:10px;" title="Ausführliche Wetter-Vorhersage für Weißenbrunn">Wetter Weißenbrunn</a></div><iframe  width="120" height="148" scrolling="no" frameborder="0" src="http://www.wetter24.de/meteo/hptool/index.php?cid=49X9141&cityName=Wei%26szlig%3Benbrunn&l=de&style=12&v=de&ver=2&c1=ffffff&c2=0060ac&c3=000000&c4=ffcc00&c5=000000&c6=ffcc00&c7=000000&f1a=3&f1b=2&f2a=3&f2b=2&f3a=3&f3b=2&ct1=1&ct2=6&ct3=2&ct4=10&ct5=12&fcd=0"></iframe><div style="height:20px;width:120px;text-align:center;background-color:#0060ac"><a href="http://www.wetter24.de/" target="_blank" style="text-decoration: none;color:#ebf1f8;font-family:Verdana,Arial,Tahoma,Times New Roman;font-weight:normal;font-size:10px" title="Aktuelles Wetter und Vorhersagen für 250.000 Orte weltweit">Mehr Wetter</a>
</div>
vllt kann mir jemand sagen voran das liegt
freu mich auf jede antwort, die uns weiterhilft

danke
 
Für Fehldarstellungen gibt es bei diesem Quellcode viele Gründe:

- nicht valider Code, selbst für html 4.01
- absolut positionierte Elemente, die sorgen bei falscher Anwendung auch für unterschiedliche Darstellung bei Webbrowsern
- Menüs werden als ul-Liste definiert, nicht als Tabelle

Tipp: überdenke die Anordnung deiner Elemente und validiere DANACH mal den Quellcode deiner Seite.
 
ok danke erst mal für die schnell antwort ich muss jetzt nochmal stück für stück den code neu generieren....

zum wichtigsten erst mal, dem menü....
wie muss ich den code ändern sodass das design bleibt und die links funktionieren

Code:
<style type="text/css">                                                       
 <!--
 A.menulink {
        display: block;
        width: 180px;
        text-align: center;
        text-decoration: none;
        font-family: Verdana;
        font-size: 20px;
        color: #FFFFFF;
        background-color: #FF0000;
        border-style: solid;
        border-width: 2px;
        border-color: #000000;
 }

 A.menulink:hover {
        border-style: solid;
        border-width: 2px;
        border-color: #white;
        color: #000000;
        background-color: #F0E1FF;
 }
 -->
</style>

<table border="0" width="110" align="left">
  <tr>
    <td><a href="index.html" class="menulink">&nbsp;Startseite</a></td>
  </tr>
  <tr>
    <td><a href="aktuelles.html" class="menulink">&nbsp;Aktuelles</a></td>
  </tr>
  <tr>
    <td><a href="spielplan.html" class="menulink">&nbsp;Spielplan 2008/09</a></td>
  </tr>
  <tr>
    <td><a href="spieler.html" class="menulink">&nbsp;Spieler</a></td>
  </tr>
  <tr>
    <td><a href="gelaende.html" class="menulink">&nbsp;Sportgelände</a></td>
  </tr>
  <tr>
    <td><a href="chronik.html" class="menulink">&nbsp;Vereinschronik</a></td>
  </tr>
  <tr>
    <td><a href="bilder.html" class="menulink">&nbsp;Bilder</a></td>
  </tr>
  <tr>
    <td><a href="gaestebuch.html" class="menulink">&nbsp;Gästebuch</a></td>
  </tr>
  <tr>
    <td><a href="links.html" class="menulink">&nbsp;Links</a></td>
  </tr>
  <tr>
    <td><a href="impressum.html" class="menulink">&nbsp;Impressum</a></td>
  </tr>
  <tr>
    <td><a href="kontakt.html" class="menulink">&nbsp;Kontakt</a></td>
  </tr>
</table>
 
Wie schon gesagt: die Tabelle durch eine ul-Liste ersetzen. Wenn Du alles per Hand bearbeitest wäre das nur ein Austauschen von HTML-Tags.
 
danke...an den rest machen wir uns dann erstmal allein und schauen wie wir alles insgesamt verbessern können
 
Und nutze den The W3C Markup Validation Service um regelmäßig die Syntax Deines Quellcodes zu überprüfen. Das ist eine von vielen Voraussetzungen. Wenn der IE etwas vermeintlich richtig anzeigt und der Mozilla falsch, ist die Wahrschienlichkeit sehr groß, dass Du ein paar Fehler im Code hast. Der IE ist eigentlich der Browser, der die W3C-Standards am schlechtesten umsetzen kann.
 
wie kann ich sowas wie z.b. Wetter genaustenes nach meiner vorstellung verschieben, damit es nicht *nur* mittig,rechts oder ganz links ist....

und im IE und Mozilla gleich aussieht°!

Code:
<a href="http://www.wetter24.de/" target="_blank" title="Wetter24: Ihr Wetter-Dienst"><img src="http://www.wetter24.de/meteo/hptool/logo_wetter24.png" alt="Wetter" width="120" height="32" border="0"></a><br/><div style="background-color:#0060ac;color:#ffffff;font-family:Tahoma,Arial,Verdana,Times New Roman;font-weight:bold;font-size:10px;;width:120px;text-align:center"><a href="http://www.wetter24.de/de/home/wetter/weltwetter/ortewetter/stadt/49X9141/weicenbrunn.html?cityID=49X9141" target="_blank" style="color:#ffffff;font-family:Tahoma,Arial,Verdana,Times New Roman;font-weight:bold;font-size:10px;" title="Ausführliche Wetter-Vorhersage für Weißenbrunn">Wetter Weißenbrunn</a></div><iframe  width="120" height="148" scrolling="no" frameborder="0" src="http://www.wetter24.de/meteo/hptool/index.php?cid=49X9141&cityName=Wei%26szlig%3Benbrunn&l=de&style=12&v=de&ver=2&c1=ffffff&c2=0060ac&c3=000000&c4=ffcc00&c5=000000&c6=ffcc00&c7=000000&f1a=3&f1b=2&f2a=3&f2b=2&f3a=3&f3b=2&ct1=1&ct2=6&ct3=2&ct4=10&ct5=12&fcd=0"></iframe><div style="height:20px;width:120px;text-align:center;background-color:#0060ac"><a href="http://www.wetter24.de/" target="_blank" style="text-decoration: none;color:#ebf1f8;font-family:Verdana,Arial,Tahoma,Times New Roman;font-weight:normal;font-size:10px" title="Aktuelles Wetter und Vorhersagen für 250.000 Orte weltweit">Mehr Wetter</a>
 
wie kann ich sowas wie z.b. Wetter genaustenes nach meiner vorstellung verschieben, damit es nicht *nur* mittig,rechts oder ganz links ist....

und im IE und Mozilla gleich aussieht°!

Code:
<a href="http://www.wetter24.de/" target="_blank" title="Wetter24: Ihr Wetter-Dienst"><img src="http://www.wetter24.de/meteo/hptool/logo_wetter24.png" alt="Wetter" width="120" height="32" border="0"></a><br/><div style="background-color:#0060ac;color:#ffffff;font-family:Tahoma,Arial,Verdana,Times New Roman;font-weight:bold;font-size:10px;;width:120px;text-align:center"><a href="http://www.wetter24.de/de/home/wetter/weltwetter/ortewetter/stadt/49X9141/weicenbrunn.html?cityID=49X9141" target="_blank" style="color:#ffffff;font-family:Tahoma,Arial,Verdana,Times New Roman;font-weight:bold;font-size:10px;" title="Ausführliche Wetter-Vorhersage für Weißenbrunn">Wetter Weißenbrunn</a></div><iframe  width="120" height="148" scrolling="no" frameborder="0" src="http://www.wetter24.de/meteo/hptool/index.php?cid=49X9141&cityName=Wei%26szlig%3Benbrunn&l=de&style=12&v=de&ver=2&c1=ffffff&c2=0060ac&c3=000000&c4=ffcc00&c5=000000&c6=ffcc00&c7=000000&f1a=3&f1b=2&f2a=3&f2b=2&f3a=3&f3b=2&ct1=1&ct2=6&ct3=2&ct4=10&ct5=12&fcd=0"></iframe><div style="height:20px;width:120px;text-align:center;background-color:#0060ac"><a href="http://www.wetter24.de/" target="_blank" style="text-decoration: none;color:#ebf1f8;font-family:Verdana,Arial,Tahoma,Times New Roman;font-weight:normal;font-size:10px" title="Aktuelles Wetter und Vorhersagen für 250.000 Orte weltweit">Mehr Wetter</a>
Indem du die positionierung in % angibst.
 
Anstelle von Positionierung (also Eigenschaft "position") ist es oft einfacher und sinnvoller, Innen- und Außenabstände festzulegen.

margin (Außenabstand)
padding (Innenabstand)

Den kann man in "px", "em" oder auch in "%" (Liste nicht vollständig) angeben.

Meistens reicht es, diese Abstände zu verwenden und hin und wieder mit einem "float" zu kombinieren. "position" ist eigentlich nur selten wirklich notwendig und man sollte an der Stelle sich gut auskennen mit CSS und der Auswirkung, die diese Positionierung hat. Auf keinen Fall sollte man alle Elemente einer Seite mit genauen Koordinaten absolut positionieren.
 
Für was brauchst Du ein Beispiel? Den ganzen Code schreiben wir Dir nicht. Dann solltest Du die Jobbörse aufsuchen.

An CSS generell kanns ja eigentlich nciht liegen, das hast Du ja bisher auch schon eingesetzt.
 
Zurück
Oben