unterschied IE und Firefox
Hans Bienhoff
- browser
Hallo Forum.
Ich bin neu hier,mache meine ersten Versuche mit Webdarstellungen, und brauche grad mal Eure Hilfe.
auf http://www.ttc-norden.de seht Ihr ein Layout
für unsere Vereinsdarstellung. Im IE 6 wird alles richtig dargestellt, jedoch in Firefox gibt es Probleme mit dem Menü.
Könnt Ihr da helfen?
<html>
<head>
<meta http-equiv="Content-Language" content="de">
<meta name="GENERATOR" content="Microsoft FrontPage 6.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Home</title>
<base target="Hauptframe">
<link rel="stylesheet" type="text/css" media="screen" href="../../frames/screen-archiv.css" />
<style type="text/css">
a:link { text-decoration:none; font-weight:bold; color:#e08000; }
a:visited { text-decoration:none; font-weight:bold; color:#0000ff; }
a:hover { text-decoration:none; font-weight:bold; background-color:#ff0; }
a:active { text-decoration:none; font-weight:bold; background-color:#cfff; }
a:focus { text-decoration:none; font-weight:bold; background-color:#080; }
</style>
<style type="text/css">
<!--
#tuer1,#tuer2,#tuer3,#tuer4,#tuer5,#tuer6 {display:none} /* #tuer4,#tuer5,#tuer6, .... */
#inhalt {
background: #FFCC00; /* Hintergrundfarbe (in diesem Beispiel die Farbe gelb */
font-family: Verdana; /* Schriftart */
font-size: 15px; /* Schriftgröße */
color: #0000FF; /* Schriftfarbe blau */
padding-left: 0px; padding-right: 10px; /* Abstand links und rechts */
cursor:pointer; /* Mauszeiger */}
a:hover {color: Red;} /* Hovereffekt (Rot) */
a:link,visited,hover {
font-family: Verdana; /* Schriftart */
font-size: 12px; /* Schriftgröße */
color: blue; /* Schriftfarbe Blau */
}
-->
</style>
<script type="text/javascript">
function auf(tuer) {
if (document.all) {
document.all[tuer].style.display="block"}
}
function zu(tuer) {
if (document.all) {
document.all[tuer].style.display="none"}
}
//-->
</script>
<base target="Hauptframe">
</head>
<body
text="#0000FF" bgcolor="#FFCC00" leftmargin="0">
<div align=center>
<p><font face="Verdana" style="font-size: 12pt">
<a href="home%20ttc%20logo.htm">Home</a></font></p>
<p>
<span id="inhalt" onclick="auf('tuer1')" onMouseOut="zu('tuer1')">Der Verein</span><br>
<table id="tuer1" onMouseOver="auf('tuer1')" onMouseOut="zu('tuer1')" border=1 bordercolor=000080 cellpadding=3 cellspacing=0>
<tr>
<td>
<a href="../der%20Verein/Vorstand.htm">Vorstand</a><br>
<a href="../der%20Verein/die_chronik_vom_tischtennisclub.htm">Chronik</a><br>
<a href="../der%20Verein/Bilder%20vom%20Anfang.htm">als alles begann</a><br>
<a href="../Doku-Vorstand/inhaltsverzeichnis.htm">nur für den Vorstand</a>
</td>
</tr>
</table>
<br>
<span id="inhalt" onclick="auf('tuer2')" onMouseOut="zu('tuer2')">Interessantes</span><br>
<table id="tuer2" onMouseOver="auf('tuer2')" onMouseOut="zu('tuer2')" border=1 bordercolor=000080 cellpadding=3 cellspacing=0>
<tr>
<td>
<a href="../interessantes/interessantes_in_lockerer_reihen.htm">Wissenswertes</a><br>
<a href="../interessantes/Sponsoren.htm">Sponsoren</a>
</td>
</tr>
</table>
<br>
<span id="inhalt" onclick="auf('tuer3')" onMouseOut="zu('tuer3')">Mannschaften</span><br>
<table id="tuer3" onMouseOver="auf('tuer3')" onMouseOut="zu('tuer3')" border=1 bordercolor=000080 cellpadding=3 cellspacing=0>
<tr>
<td>
<a href="../Manschaften/bilder_und_kleine_filme.htm">Bilder - Filme</a><br>
<a href="../Damen/Damen.htm">Damen</a><br>
<a href="../Herren/Herren.htm">Herren</a><br>
<a href="../Jugend/Jugend.htm">Jugend</a><br>
<a href="http://ttvn.click-tt.de/cgi-bin/WebObjects/ClickTTVN.woa/wa/clubPoolsTT?displayTyp=vorrunde&club=5552">Mannschaftsmeldung</a><br>
<a href="../Freizeitgruppe/freizeitgruppe.htm">Freizeitgruppe</a>
</td>
</tr>
</table>
<br>
<span id="inhalt" onclick="auf('tuer4')" onMouseOut="zu('tuer4')">Training</span><br>
<table id="tuer4" onMouseOver="auf('tuer4')" onMouseOut="zu('tuer4')" border=1 bordercolor=000080 cellpadding=3 cellspacing=0>
<tr>
<td>
<a href="../Training/trainning%20wo.htm">wo</a><br>
<a href="../Training/trainingszeiten.htm">wann</a><br>
<a href="../Training/Training.htm">wie komme ich dahin</a><br>
<a href="../PDF/Eintrittserklaerung.pdf">Anmeldung</a></td>
</tr>
</table>
<br>
<span id="inhalt" onclick="auf('tuer5')" onMouseOut="zu('tuer5')">Termine</span><br>
<table id="tuer5" onMouseOver="auf('tuer5')" onMouseOut="zu('tuer5')" border=1 bordercolor=000080 cellpadding=3 cellspacing=0>
<tr>
<td>
<a href="../termine.htm">Termine</a><br>
</td>
</tr>
</table>
<br>
<span id="inhalt" onclick="auf('tuer6')" onMouseOut="zu('tuer6')">Meldungen</span><br>
<table id="tuer6" onMouseOver="auf('tuer6')" onMouseOut="zu('tuer6')" border=1 bordercolor=000080 cellpadding=3 cellspacing=0>
<tr>
<td>
<a href="mailto:webmaster@ttc-norden.de">Ergebnisse melden</a><br>
<a href="../Anmeldungen.htm">am Turnier anmelden</a>
</td>
</tr>
</table>
</p>
<a href="http://www.ttc-norden.de/cgi-bin/guestbook.php.cgi">Gästebuch</a></p>
<a href="../Ostfrieslandtunier/Tuniere_Ostfriesland_Startseite.htm">Turniere</a></p>
<a href="../impressum.htm">Impressum</a></b></font></p>
<p style="margin-top: 0; margin-bottom: 0"><font size="1"> </font></p>
<p style="margin-top: 0; margin-bottom: 0">
<img border="0" src="../%22/cgi-bin/counter.pl?3"></p>
</body>
</html>
Hallo!
Erstens: Teste nie mit dem IE. Schreibe deinen Quelltext und sorge dafür, dass er im Firefox oder Opera so aussieht, wie er soll. Dann kannst du dich daran machen die Fehler, die der IE macht, auszubügeln. Merke: Der IE stellt Dinge grundsätzlich falsch dar. Bei Sätzen wie "der IE machts richtig und der FF machts falsch" kannst du dir sicher sein, dass der Quelltext falsch ist.
Zweitens: Frage den Validator, was er von <http://validator.w3.org/check?uri=http%3A%2F%2Fwww.ttc-norden.de%2Fdeiner Seite> hält. Wenn der Validator nicht mehr meckert, dann ist dein Quelltext richtig. Aber lasse auch dein CSS durchchecken.
Drittens: Verwende keine Tabellen um deine Seite zu designen. Verwende CSS-Layouts.
Wenn du diese 3 Punkte befolgst, dann wird deine Seite keine grobe Fehler mehr enthalten. Wenn es dann noch kleinere Dinge gibt, dann können wir dir auch helfen. Aber es ist müßig und sinnlos in einem fehlerhaften Code nach Gründe für Darstellungsfehler zusuchen.
ciao, ww
Hi,
auf http://www.ttc-norden.de seht Ihr ein Layout
für unsere Vereinsdarstellung. Im IE 6 wird alles richtig dargestellt
nein - selbst in diesem fehlertoleranten Browser nicht. Vergrößere die Schrift oder verkleinere das Fenster und es kommt zu üblen Überlagerungen.
<html>
hier fehlt wie schon gesagt wurde der DOCTYPE.
<meta name="GENERATOR" content="Microsoft FrontPage 6.0">
das erklärt den grauenvollen Code.
<base target="Hauptframe">
auf Frames solltest Du auch verzichten.
</style>
<style type="text/css">
<!--
es ist unnötig, mehrere Style-Bereiche anzugeben und der HTML-Kommentar ebenfalls.
font-family: Verdana; /* Schriftart */
hier fehlt die generische Schriftfamilie sans-serif.
if (document.all) {
warum schließt Du so viele Browser aus? Die Funktion scheint nicht wichtig zu sein, oder?
<base target="Hauptframe">
doppelt hält besser? ;-)
text="#0000FF" bgcolor="#FFCC00" leftmargin="0">
Du verwendest doch bereits CSS - wozu dann diese teilweise ungültigen Angaben?
<p><font face="Verdana" style="font-size: 12pt">
dito; zwar in Transitional noch zulässig, aber dennoch missbilligt.
<a href="home%20ttc%20logo.htm">Home</a></font></p>
Findest Du solche Adressen wirklich schön?
<span id="inhalt" onclick="auf('tuer1')" onMouseOut="zu('tuer1')">Der Verein</span><br>
oha - wie ich sehe, ist die Funktion doch extrem wichtig.
Du solltest wissen, dass die mindestens jeder dritte Besucher die über display:none ausgeblendeten Unterlinks nicht aufrufen kann!
<br>
Abstände definierst Du besser über CSS.
<img border="0" src="../%22/cgi-bin/counter.pl?3"></p>
Du hast wirklich ein Verzeichnis
Mein Tip: fang neu an - ohne Frames und nicht mit Frontpage.
freundliche Grüße
Ingo