Jens Schärer: Fehler bei Darstellung in unterschiedlichen Browsern

Nabend! Ich hab mich ran gemacht und wollte etwas rumprobieren, nur stellt sich der InternetExplorer mal wieder bockig dran. Folgende Seite wird im Opera und Mozilla korrekt angezeigt, im IE verweigert jedoch der rechte Bereich mit dem Datum seinen Dienst.

http://gamechexx.net/entwurf/web/

Code:

<tr valign="top">
   <td rowspan="2" width="488" height="93">
    <img src="images/top_banner.gif" alt="GameCheXX.de - Where Experience Plays!" width="488" height="93" border="0">
   </td>

<td rowspan="2" valign="top" width="100%" height="93" background="images/top_background.gif">
     
   </td>

<td valign="top" width="200" height="75">
    <img src="images/top_rightflame.gif" height="75" width="200" alt="Flame" border="0"><br>
   </td>
  </tr>

<tr height="18" valign="top">
   <td width="200" height="18" background="images/top_rightdate_background.gif">
    <font face="Verdana" size="2" color="#FFFFFF"><div align="right"><b>7. Juli - 21:45 Uhr </b></div></font>
   </td>
  </tr>

Es dreht sich Hauptsächlich um den rechten Bereich, der Rest stimmt ja soweit. Wo liegt mein Fehler bzw. wie bekomme ich dem IE bei, dass der das ganze richtig darstellt ?

  1. hi,

    Nabend! Ich hab mich ran gemacht und wollte etwas rumprobieren, nur stellt sich der InternetExplorer mal wieder bockig dran.

    Nicht nur der. Ich bekomme in _allen_ Browsern grade mal deine oberste Tabellenzeile angezeigt, der Rest ist nicht einmal vom IE mit seiner bekannt hohen Fehlertoleranz auflösbar. Daß mozilla/Netscape und Opera überhaupt etwas anzeigen, ist ein kleines Wunder.

    Folgende Seite wird im Opera und Mozilla korrekt angezeigt

    Welche Versionen hast du getestet?

    im IE verweigert jedoch der rechte Bereich mit dem Datum seinen Dienst.

    Welche IE-Version?

    http://gamechexx.net/entwurf/web/

    http://gamechexx.net/entwurf/web/ beinhaltet ganz einfach eine völlig "zerschossene" Tabelle. Wenn du die Tabelle so korrigierst, daß sie korrekt ist, ist dein "Problem" wahrscheinlich erledigt.

    Grüße aus Berlin

    Christoph S.

    1. hi,

      Nabend! Ich hab mich ran gemacht und wollte etwas rumprobieren, nur stellt sich der InternetExplorer mal wieder bockig dran.
      Nicht nur der. Ich bekomme in _allen_ Browsern grade mal deine oberste Tabellenzeile angezeigt, der Rest ist nicht einmal vom IE mit seiner bekannt hohen Fehlertoleranz auflösbar. Daß mozilla/Netscape und Opera überhaupt etwas anzeigen, ist ein kleines Wunder.

      Ich wüsste nicht, was daran verkehrt sein soll. Es befindet sich auch nur eine Tabellenzeile in der Datei.

      Gruß,
      Jens S.

      1. hallo Jens,

        Du hast inzwischen die Seite, die online steht, verändert, ich bekomme eine etwas andere Anzeige als vorhin. Das ist dein gutes Recht, nur solltest du das auch sagen, damit wir tatsächlich über dieselben Dinge sprechen.

        Grüße aus Berlin

        Christoph S.

  2. Hallo,

    <tr height="18" valign="top">
       <td width="200" height="18" background="images/top_rightdate_background.gif">
        <font face="Verdana" size="2" color="#FFFFFF"><div align="right"><b>7. Juli - 21:45 Uhr </b></div></font>
       </td>
      </tr>

    Es dreht sich Hauptsächlich um den rechten Bereich, der Rest stimmt ja soweit. Wo liegt mein Fehler bzw. wie bekomme ich dem IE bei, dass der das ganze richtig darstellt ?

    FONT darf nur Inline-Elemente enthalten.
    http://selfhtml.teamone.de/html/referenz/elemente.htm#font

    Die rechtsbündige Ausrichtung kann man auch in der Tabellenzelle angeben, dann wird das DIV-Element überflüssig. Noch besser wäre allerdings der Einsatz von CSS. Damit kann man auch auf das FONT-Element gänzlich verzichten.
    http://selfhtml.teamone.de/css/index.htm

    viele Grüße

    Axel

  3. <td rowspan="2" width="488" height="93">
       <img src="images/top_banner.gif" alt="GameCheXX.de - Where Experience Plays!" width="488" height="93" border="0">
       </td>

    Beim Tabellenlayout sollte man immer tunlichst darauf achten, keinerlei überflüssige Zeichen in den Zellen zu haben. Schreibe obige drei Zeilen in eine Zeile, ohne jeglichen Zwischenraum zwischen <td>, <img> und </td> und es funktioniert.
    Entferne anschließend auch bei den anderen Zellen die leeren Bytes. Und denke Dir vielleicht auch etwas aussagekräftigere Alternativtexte für die Grafiken aus. Der alt-Text soll die Grafik und ihre Funktion bzw. Bedeutung beschreiben, das bedeutet aber nicht unbedingt, daß er ihren Inhalt 1:1 wiedergeben muß. "Gamechexx.de-Logo" wäre für obiges Beispiel IMHO die bessere Wahl.

    Gruß,
      soenk.e

    PS: Achte bitte beim nächsten Mal darauf, daß der Code, den Du hier zitierst und jener, der auf Deinen Seiten steht, übereinstimmt.

    1. Danke für die schnelle Antwort. Jetzt funktionierts wunderbar :) Wo hab ich denn anderen Code gepostet, wie er auf der Seite war ? Ich bin mir ziemlich sicher, dass ich genau dieselbe Seite hochgeladen hatte.

      1. Wo hab ich denn anderen Code gepostet, wie er auf der Seite war ?

        Der Code der Seite wich unter anderem in den Höhenangaben der Zellen leicht von dem ab, was Du hier zitiert hast. In der Seite addierten sich die Höhen zu 90 (75+15), obwohl die gesamte Titeltabelle 93 Pixel hoch sein sollte; hier im Forum stimmte es hingegen (75+18).
        Da Du ausgerechnet ein Problem mit der Zellenhöhe der 15 bzw. eigentlich 18 Pixel hohen Datumszelle hattest, hätte die Ursache auf den ersten Blick durchaus auch dort liegen können.

        Gruß,
          soenk.e

    2. Hallo,

      <img src="images/top_banner.gif" alt="GameCheXX.de - Where Experience Plays!" width="488" height="93" border="0">

      Und denke Dir vielleicht auch etwas aussagekräftigere Alternativtexte für die Grafiken aus. Der alt-Text soll die Grafik und ihre Funktion bzw. Bedeutung beschreiben,

      Was bringt denjenigen, die das Logo nicht sehen können, die Information, dass es sich um ein Logo handelt? Warum ist es überhaupt relevant, dass der Text als Alternativtext einer Grafik erkennbar ist?
      Interessanter wäre, ob es sich um eine Überschrift handelt und ob die Grafik und damit der Alternativtext entsprechend ausgezeichnet werden sollten.

      das bedeutet aber nicht unbedingt, daß er ihren Inhalt 1:1 wiedergeben muß.

      Sofern es sich um Textinhalt handelt, ist dies naheliegend. Der Slogan der Seite lautet »Where Experience Plays« und ist Textinhalt der Grafik, deshalb sollte ihn der Alternativtext m.E. wiedergeben, anstatt eine weniger relevante Zusatzinformation zu bieten.

      "Gamechexx.de-Logo" wäre für obiges Beispiel IMHO die bessere Wahl.

      Dass es ein Logo ist, gehört m.M.n. eher in das title-Attribut. Für Beschreibungen des Logos steht zudem longdesc zur Verfügung, oder man nutzt einen nebenstehender Link.

      http://www.cs.tut.fi/~jkorpela/html/alt.html#logo

      Mathias

      1. <img src="images/top_banner.gif" alt="GameCheXX.de - Where Experience Plays!" width="488" height="93" border="0">

        Und denke Dir vielleicht auch etwas aussagekräftigere Alternativtexte für die Grafiken aus. Der alt-Text soll die Grafik und ihre Funktion bzw. Bedeutung beschreiben,

        Was bringt denjenigen, die das Logo nicht sehen können, die Information, dass es sich um ein Logo handelt?

        Ich für meinen Teil frage mich grundsätzlich, was wohl hinter den großen, leeren Flächen stecken mag, die mir mein Browser anzeigt. Und mit dem vorhandenen Text könnte ich nicht viel anfangen. Mit dem Hinweis, daß es sich um das Logo handelt, könnte ich mir hingegen zumindest was hübsches ausmalen ;)

        Warum ist es überhaupt relevant, dass der Text als Alternativtext einer Grafik erkennbar ist?

        Siehe oben (und nein, das gilt _nicht_ automatisch für alle Grafiken).

        Interessanter wäre, ob es sich um eine Überschrift handelt und ob die Grafik und damit der Alternativtext entsprechend ausgezeichnet werden sollten.

        Naja, davor stellt sich eher die Frage, ob man Dinge wie Überschriften (oder Text allgemein) überhaupt als Grafiken ablegen sollte (was sicher eine Glaubensfrage ist, es gibt gute Gründe dafür und dagegen). Ich stehe dem eher skeptisch gegenüber, daher zum Teil wohl auch meine unten dargestellte Einschätzung.

        Der Slogan der Seite lautet »Where Experience Plays« und ist Textinhalt der Grafik, deshalb sollte ihn der Alternativtext m.E. wiedergeben, anstatt eine weniger relevante Zusatzinformation zu bieten.

        Sieht so aus, als wenn ich dieses Sprüchlein bzw. seinen Informationsgehalt für so überflüssig gehalten habe, daß es weniger "wert" war als die Information, daß es sich um ein Logo handelt.
        Ich kann Deine Sichtweise aber durchaus nachvollziehen.

        Gruß,
          soenk.e