Marco Helgert: Netscape, Tabelle, Sprengung (wieder mal)

Ich bin am Ausrasten!

Also: Eigentlich eine ganz einfache Tabelle, die den Seitekopf anzeigen soll.
Tut sie im IE (4 und 6), Opera 6 und NN4.7 auch gut. Im Mozilla 0.9.6 jedoch nicht. Wie oft ich mir den code auch anschaue - ich entdecke nicht warum.
Alle hier gefundenen Tricks wurden bereits ausgenutzt (td-tags ohne widths - nur von Bilder angegeben, Tabellenbreite insgesamt kleiner als die Summer der Bilder, Löschen aller Leerzeichen und Zeilenumbrüche (sowieso, da von PHP generiert), border="0" bei jedem Bild).

Also, erstmal den überholten Quelltext, da der PHP-Output nicht ganz so lesbar ist.

<table cellpadding="0" cellspacing="0" border="0" width="783" height="70">
  <tbody>
    <tr>
      <td rowspan="4" colspan="1">
        <a href="/index.php?lang=<?php echo $lang ?>">
          <img src="../images/hauptmenu_1x1.gif" alt="" width="215" height="70" border="0">
        </a>
      </td>
      <td rowspan="4" colspan="1">
        <img src="../images/hauptmenu_1x2.gif" alt="" width="18" height="70"border="0">
      </td>
      <td height="5" width="468">
        <img src="../images/hauptmenu_1x3.gif" alt="" width="468" height="5" border="0">
      </td>
      <td rowspan="1" colspan="5">
        <img src="../images/hauptmenu_1x4.gif" alt="" width="82" height="5" border="0">
      </td>
    </tr>
    <tr>
      <td rowspan="2" colspan="1">
        <a href=".(Banner....." target="_top">
          <img src="http://banner" alt="ad" width="468" height="60" border="0">
        </a>
      </td>
      <td>
        <img src="../images/hauptmenu_2x2.gif" alt="" width="12" height="20" border="0">
      </td>
      <td>
        <?php $link = str_replace("lang=2", "lang=1", $REQUEST_URI); ?>
        <a href="<?php echo $link ?>">
          <img src="../images/hauptmenu_2x3.gif" alt="D" width="32" height="20" border="0">
        </a>
      </td>
      <td>
        <img src="../images/hauptmenu_2x4.gif" alt="" width="4" height="20" border="0">
      </td>
      <td>
        <?php $link = str_replace("lang=1", "lang=2", $REQUEST_URI); ?>
        <a href="<?php echo $link ?>">
          <img src="../images/hauptmenu_2x5.gif" alt="E" width="32" height="20" border="0">
        </a>
      </td>
      <td>
        <img src="../images/hauptmenu_2x6.gif" alt="" width="2" height="20" border="0">
      </td>
    </tr>
    <tr>
      <td rowspan="1" colspan="5">
        <img src="../images/hauptmenu_3x1a.gif" alt="31a" width="82" height="40" border="0">
      </td>
    </tr>
    <tr>
      <td>
        <img src="../images/hauptmenu_4x1.gif" alt="" width="468" height="5" border="0">
      </td>
      <td rowspan="1" colspan="5">
        <img src="../images/hauptmenu_4x1.gif" alt="31b" width="82" height="5" border="0">
      </td>
    </tr>
  </tbody>
</table>

Fällt einem von euch was daran auf? So langsam gebe ich auf....

PQ

PS: Direkte URL zum Fehler: http://www.f1-stats.de/index.php?lang=2

  1. Hallo !

    Ich versuche 'mal mein Glück (ungetestet):

    Wenn ich mich recht entsinne, nimmt Mozilla als Höhe der Tabellenzelle (soweit nicht anders angegeben) die Schrifthöhe des enthaltenen Textes an, und das selbst dann, wenn gar kein Text enthalten ist.

    Abhilfe würde dann eine explizite Definition der Zeilenhöhe per CSS (line-height: SOUNDSOpx;) für die betroffenen Tabellenzellen schaffen.

    Gruß,

    kerki

    P.S.: Anderes Problem: Mein IE 6 zeigt statt des Werbebanners nur einen schwarzen Kasten.

    1. Wenn ich mich recht entsinne, nimmt Mozilla als Höhe der Tabellenzelle (soweit nicht anders angegeben) die Schrifthöhe des enthaltenen Textes an, und das selbst dann, wenn gar kein Text enthalten ist.

      Abhilfe würde dann eine explizite Definition der Zeilenhöhe per CSS (line-height: SOUNDSOpx;) für die betroffenen Tabellenzellen schaffen.

      Das ist ja böse. Werde ich gleich mal versuchen....

      P.S.: Anderes Problem: Mein IE 6 zeigt statt des Werbebanners nur einen schwarzen Kasten.

      Das ist derzeit normal. Ich habe in der Fehlersuche erstmal nur den halben Bannercode drin....
      Macht nix - ist eh nur ein Bannertausch :-)

      PQ

    2. Wenn ich mich recht entsinne, nimmt Mozilla als Höhe der Tabellenzelle (soweit nicht anders angegeben) die Schrifthöhe des enthaltenen Textes an, und das selbst dann, wenn gar kein Text enthalten ist.

      Abhilfe würde dann eine explizite Definition der Zeilenhöhe per CSS (line-height: SOUNDSOpx;) für die betroffenen Tabellenzellen schaffen.

      Es sieht besser aus, aber trotzdem noch schlimm. (http://www.f1-stats.de/index.php?lang=1)

      Was mir aber auffällt: Es scheint, als ob er bei jedem verlinkten Bild unten Platz lassen würde. Ich weiss nur nicht warum! Einer von euch vielleicht?

      PQ

  2. Ich hab mir den reinen Source mal angeschaut:
    "<!-- Nix fuer alte Browservar quotenumber = 150 ;"
    Das ist so aber nicht in Ordnung... Das "Nix fuer alte Browser" sollte in /* .. */ und dahinter - also vor dem var - sollte ein Leerzeichen.

    'td "rowspan="1" colspan="1"' muss glaub ich auch nicht immer sein, oder? Ist doch eigentlich selbstverständlich für den Browser...
    Und das Problem mit den Images: Ob das was mit der befohlenen Höhe zu tun hat?
    Auch sollte vermieden werden dort wo eine Grafik einzeln steht ohne Text eine CSS-Schriftgrößen-Definition gelten zu lassen...
    Möglicherweise funktioniert das ganze besser wenn man ein "td.img { background-color:#000000; }" oder so in der Art definiert und die entsprechenden td's dann mit 'class="img"' zuzuordnen...

    Ich weiß nur das ich das Problem mit dem Platz unter den Grafiken auch mal hatte, jedoch weiß ich nicht mehr wie ich das lösen konnte... (Auch das durchsehen entsprechender Quelltext hat mir keine weiteren Ergebnisse geliefert)

    ppa. NotNamed

    1. Ich hab mir den reinen Source mal angeschaut:
      "<!-- Nix fuer alte Browservar quotenumber = 150 ;"
      Das ist so aber nicht in Ordnung... Das "Nix fuer alte Browser" sollte in /* .. */ und dahinter - also vor dem var - sollte ein Leerzeichen.

      What?
      Also ich denke, dass JavaScript-Code schon <-- ...  gehört, oder? Das ist kein PHP (wegen der /* ... */)

      'td "rowspan="1" colspan="1"' muss glaub ich auch nicht immer sein, oder? Ist doch eigentlich selbstverständlich für den Browser...

      Sicher, nur das Grundgerüst für die table hat ein Tool gebaut. Ich kann da ja noch mal Hand anlegen....

      Und das Problem mit den Images: Ob das was mit der befohlenen Höhe zu tun hat?
      Auch sollte vermieden werden dort wo eine Grafik einzeln steht ohne Text eine CSS-Schriftgrößen-Definition gelten zu lassen...

      Siehe eine andere Antwort hier im thread. Ohne diese Angaben sieht es noch verrissener aus. Es scheint wirklich so, als zieht der Mozilla die Zellen soweit vertikal auf, dass die Schrift reinpassen würde - auch wenn keine Schrift dort steht.

      Möglicherweise funktioniert das ganze besser wenn man ein "td.img { background-color:#000000; }" oder so in der Art definiert und die entsprechenden td's dann mit 'class="img"' zuzuordnen...

      Das ist mein nächster Schritt - nach dem Kaffee trinken ,-)

      Ich weiß nur das ich das Problem mit dem Platz unter den Grafiken auch mal hatte, jedoch weiß ich nicht mehr wie ich das lösen konnte... (Auch das durchsehen entsprechender Quelltext hat mir keine weiteren Ergebnisse geliefert)

      Mift!
      Ich meine aber immer noch, dass die Links irgendwas Böses bewirken.....

      PQ

      1. Hallo !

        Siehe eine andere Antwort hier im thread. Ohne diese Angaben sieht es noch verrissener aus. Es scheint wirklich so, als zieht der Mozilla die Zellen soweit vertikal auf, dass die Schrift reinpassen würde - auch wenn keine Schrift dort steht.

        Dem ist auch so.

        durch

        td {font-size:1px;}

        ist dein Problem Geschichte (diesmal getestet)! :-)

        Gruß,

        kerki

        1. Hallo !

          Siehe eine andere Antwort hier im thread. Ohne diese Angaben sieht es noch verrissener aus. Es scheint wirklich so, als zieht der Mozilla die Zellen soweit vertikal auf, dass die Schrift reinpassen würde - auch wenn keine Schrift dort steht.

          Dem ist auch so.
          durch
          td {font-size:1px;}
          ist dein Problem Geschichte (diesmal getestet)! :-)

          Spitze! Das stimmt.
          Ich danke dir - Mozilla geht nun auch!

          PQ

      2. Also ich denke, dass JavaScript-Code schon <-- ...  gehört, oder? Das ist kein PHP (wegen der /* ... */)

        /* */ gilt auch für JavaScript und CSS, bei CSS ist es die einzige Möglichkeit einen Kommentar anzufügen.
        // gilt immer für eine ganze Zeile - so soll es zumindest sein, mit /* */ sind auch Auschnitte möglich, da */ den Kommentar ja wieder begrenzt. (Denk ich mal)
        <!-- soltle einmal am Anfang und //--> ans Ende, damit alte Browser kein JS-Quatsch anzeigen.
        Außerdem denke ich meint NotNamed (der treibt sich auch überall rum...), dass die Anweisung "var (...)" vom Text getrennt werden sollte, so nimtm der Browser sie ja gar nicht war, oder verfälscht vielleicht sogar das Ergebnis etwas, so genau kann ich das nicht sagen, Werbebanner seh ich eigentlich nie... ;)

        Ich meine aber immer noch, dass die Links irgendwas Böses bewirken.....

        Bei meinem Mozilla vom 30.11.2001 bewirkt deine ganze Seite was böses... Will ich sie Aufrufen: Crash, aber das wird wohl eher am Moz liegen.
        Also mit Link oder ohne Link passt das Bild bei mir ganz genau in die Tabelle... Hier mal ein Source Auszug:

        <table width="750" border="0" cellspacing="0" cellpadding="0"><tr><td class="topbord">
        <table width="742" border="0" cellspacing="1" cellpadding="0"><tr>
        <td width="5" class="topbord"> </td>
        <td width="148" class="topimg"><a href="#"><img src="image.jpg" width="148" height="83" alt="Themengrfik [image.jpg - x.xxx Byte]"></a></td>
        <td width="5" class="topbord"> </td>
        (...)
        </tr></table></td></tr></table>
        [ Quelle: http://www.starship-andromeda.de/beta ]

        Die dazugehörigen Stylesheets:
        p,td,.format { color:#f0f0f0; font-family:verdana,arial,helvetica; font-size:10pt; }
        td.topbord,td.infobord { background-color:#336699; }
        td.topimg { background-color:#000000; }

        Aber mit der font-size:1pt; gehts ja auch... Von daher ist die ganze Sache in Ordnung, ich wollte das nur nicht auf diese Art lösen... (Entweder das oder es gab doch wieder irgendein Problem. Ich denke eher letzteres... gg)

        Ach, was schwafel ich hier eigentlich rum?
        time