Stephan: Innenabstand in Tabelle bei NS 7

Hallo an alle,
ich bin am verzweifeln, weil ich anscheinen den Wald vor lauter Bäumen nicht sehe.

Ich hab eine Navigation mit Textlinks in Tabelle. Zwischen den einzelnen Links sind Blindgifs als Abstandshalter in jeweils einer einzelnen Zelle.
Überall funktioniert alles wie gewollt (IE, netscape 4, Opera) nur im Netscape 7 nicht.
Da haben die Blindgifs einen Abstand oben und unten zur Zellenbegrenzung.
Ums deutlich zu machen, die Navigation soll so aussehen:

Link 1
(Blindgif-Abstand)
Link 2
(Blindgif-Abstand)
Link 3
usw.
Im Netscape 7 ist aber durch den Innenabstand der gewollte Abstand zu groß, so daß die Tabelle in die Länge gezogen wird.

Der soll einfach das Blindgif von der Höhe her bündig in die Tabellenzelle setzen (wie alle anderen), macht er aber nicht.
Cellpading und -spacing sind auf null, per css geht auch nicht.

Auszug aus dem Quelltext hier:

</table>
<table border="0" cellspacing="0" cellpadding="0" background="layoutgfx/navbghell2.gif">
<tr>
    <td><img src="layoutgfx/infos.gif" width="97" height="25" border="0"></td>
</tr>
<tr>
    <td><img src="layoutgfx/space.gif" width="1" height="7" border="0"></td></tr>
<tr>
    <td>  <img src="layoutgfx/punkt3.gif" width="4" height="10" border="0"> <a href="../content/kinotipp.html" target="haupt" class="navigation">Kinotipp</a></td>
</tr>
<tr>
    <td><img src="layoutgfx/space.gif" width="1" height="2" border="0"></td>
</tr>
<tr>
    <td>  <img src="layoutgfx/punkt3.gif" width="4" height="10" border="0"> <a href="../content/theater.html" target="haupt" class="navigation">Theater Trier</a></td>
</tr>

Das muss so simpel sein, aber ich komm echt nicht weiter.
Wieso macht der 7er einen Abstand wo keiner sein soll?

Vielen Dank für einen Antwort.
Gruß, Stephan

  1. Hi

    Ich hab eine Navigation mit Textlinks in Tabelle. Zwischen den einzelnen Links sind Blindgifs als Abstandshalter in jeweils einer einzelnen Zelle.

    [ ] Du kennst die CSS-Eigenschaft padding.

    Überall funktioniert alles wie gewollt (IE, netscape 4, Opera) nur im Netscape 7 nicht.

    [ ] Du kennst das Verhalten der Gecko-Engine.

    Ums deutlich zu machen, die Navigation soll so aussehen:
    Link 1
    (Blindgif-Abstand)
    Link 2
    (Blindgif-Abstand)
    Link 3
    usw.
    Im Netscape 7 ist aber durch den Innenabstand der gewollte Abstand zu groß, so daß die Tabelle in die Länge gezogen wird.

    [ ] Du kennst die CSS-Eigenschaft margin.

    Der soll einfach das Blindgif von der Höhe her bündig in die Tabellenzelle setzen (wie alle anderen), macht er aber nicht.
    Cellpading und -spacing sind auf null, per css geht auch nicht.

    [ ] Du kennst die CSS-Eigenschaft border-spacing.

    Auszug aus dem Quelltext hier:

    </table>
    <table border="0" cellspacing="0" cellpadding="0" background="layoutgfx/navbghell2.gif">
    <tr>
        <td><img src="layoutgfx/infos.gif" width="97" height="25" border="0"></td>
    </tr>
    <tr>
        <td><img src="layoutgfx/space.gif" width="1" height="7" border="0"></td></tr>
    <tr>
        <td>  <img src="layoutgfx/punkt3.gif" width="4" height="10" border="0"> <a href="../content/kinotipp.html" target="haupt" class="navigation">Kinotipp</a></td>
    </tr>
    <tr>
        <td><img src="layoutgfx/space.gif" width="1" height="2" border="0"></td>
    </tr>
    <tr>
        <td>  <img src="layoutgfx/punkt3.gif" width="4" height="10" border="0"> <a href="../content/theater.html" target="haupt" class="navigation">Theater Trier</a></td>
    </tr>

    Das muss so simpel sein, aber ich komm echt nicht weiter.
    Wieso macht der 7er einen Abstand wo keiner sein soll?

    [ ] Du kennst CSS.
    [ ] Du kennst SelfHTML und die interne Suchfunktion.

    CSS-Glocke

    1. Hallo,

      [ ] Du kennst die CSS-Eigenschaft padding.
      [ ] Du kennst das Verhalten der Gecko-Engine.
      [ ] Du kennst die CSS-Eigenschaft margin.
      [ ] Du kennst die CSS-Eigenschaft border-spacing.
      [ ] Du kennst CSS.
      [ ] Du kennst SelfHTML und die interne Suchfunktion.

      [ ] Ich weiß, dass keiner der oben angeführten Punkte eine direkte Erklärung/Lösung für das Problem darstellt.

      SCNR

      Axel

    2. Typische Antwort in diesem Forum!

      [ ] Du kennst die CSS-Eigenschaft padding.

      Ja, habe schon geschrieben, daß diese nichts nützt (seltsamerweise).

      [ ] Du kennst das Verhalten der Gecko-Engine.

      Anscheinend nicht, erklär Sie doch.

      [ ] Du kennst die CSS-Eigenschaft margin.

      (siehe oben "padding")

      [ ] Du kennst die CSS-Eigenschaft border-spacing.

      Ja, aber der Abstand ist wie beschrieben innerhalb der zelle, nicht außerhalb.

      [ ] Du kennst CSS.

      Nein, ich bin dumm wie Brot.

      [ ] Du kennst SelfHTML und die interne Suchfunktion.

      Nein, woher auch.

  2. Hallo,

    </table>
    <table border="0" cellspacing="0" cellpadding="0" background="layoutgfx/navbghell2.gif">
    <tr>
        <td><img src="layoutgfx/infos.gif" width="97" height="25" border="0"></td>
    </tr>
    <tr>
        <td><img src="layoutgfx/space.gif" width="1" height="7" border="0"></td></tr>
    <tr>
    Das muss so simpel sein, aber ich komm echt nicht weiter.
    Wieso macht der 7er einen Abstand wo keiner sein soll?

    Nach HTML4 strict werden Grafiken auf der Text-Grundlinie dargestellt. Der Abstand unter den Bildern, ist der Platz, den die Unterschneidungen bei den Buchstaben g, q, µ ... benötigen würden.

    Eine Möglichkeit, das zu verhindern, ist, das Bild als Block-Element darstellen zu lassen:

    <td><img src="layoutgfx/infos.gif" width="97" height="25" border="0" alt="" style="display:block;"></td>
    ...
    <td><img src="layoutgfx/space.gif" width="1" height="7" border="0" alt="" style="display:block;"></td>

    Übrigens ist das alt-Attribut im img-Tag zwingend vorgeschrieben.

    viele Grüße

    Axel

    1. Hallo Axel,
      Danke für Deine Antwort.
      Mit Deiner Lösung wird die Tabelle allerdings noch länger, statt kürzer.
      Die grafik ist zentiert in der Zelle, also oben und unten der gleiche Abstand, der eigentlich nicht da sein sollte.
      Ich will einfach nur eine Grafik in einer Tabelle, die die Zelle komplett ausfüllt (vertikal).
      Warum funktioniert das nicht?

      Gruß, Stephan

      1. Hallo,

        Danke für Deine Antwort.
        Mit Deiner Lösung wird die Tabelle allerdings noch länger, statt kürzer.
        Die grafik ist zentiert in der Zelle, also oben und unten der gleiche Abstand, der eigentlich nicht da sein sollte.
        Ich will einfach nur eine Grafik in einer Tabelle, die die Zelle komplett ausfüllt (vertikal).
        Warum funktioniert das nicht?

        Keine Ahnung. Folgende Grafiken in Tabellenzellen stoßen bei mir im MSIE5.5, NN7.0 und Opera6.05 unmittelbar aneinander:

        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
                "http://www.w3.org/TR/html4/strict.dtd">
        <html>
        <head>
        <title>Tabelle</title>
        </head>
        <body>
        <table border="1" cellspacing="0" cellpadding="0">
        <tr>
         <td><img src="duke0.gif" width="1" height="7" border="1" alt="" style="display:block;"></td>
        </tr>
        <tr>
         <td><img src="duke0.gif" width="100" height="70" border="1" alt="" style="display:block;"></td>
        </tr>
         <td><img src="duke0.gif" width="1" height="2" border="1" alt="" style="display:block;"></td>
        </tr>
        <tr>
         <td><img src="duke0.gif" width="100" height="70" border="1" alt="" style="display:block;"></td>
        </tr>
        </table>
        </body>
        </html>

        Hast Du eventuell irgendwo die Höhe für table, tr und/oder td festgelegt?

        viele Grüße

        Axel

        1. Hallo Axel,

          nein ich hatte keine festen Größenangaben.
          Frag micht nicht, was ich vorhin falsch gemacht hab beim
          ausprobieren. Jetzt gehts auf jeden Fall, Danke!
          Allerdings funktioniert die Sache jetzt nicht mehr im Netscape 4.7!
          Da hab ich jetzt einen Pixel Abstand zwischen den Zellen?!
          Eigentlich hatte ich das "display:" auch anders verstanden in SelfHTML...

          Trotzdem, damit komme ich weiter, ich dachte nur nicht, daß eine Navigationstabelle mit simplen Textlinks untereinander soviel Probleme machen kann.
          Ist das normal, daß ich beim NS 7 das so machen muss, nur um eine Grafik in einer Tabelle anzuzeigen? Das war doch vorher nicht so ein Gefummel...

          Na ja, ich mach mich morgen noch mal dran. vielen Dank und Gruß

          Stephan

          1. Hallo,

            Allerdings funktioniert die Sache jetzt nicht mehr im Netscape 4.7!

            Den kannst Du mit einer CSS-Browserweiche ausschließen. Das CSS in eine zentrale Definition mit einer Klasse für die Bilder mit display:block; und dann:
            http://aktuell.de.selfhtml.org/tippstricks/css/browserweiche/index.htm

            viele Grüße

            Axel

          2. Hi!

            Trotzdem, damit komme ich weiter, ich dachte nur nicht, daß eine Navigationstabelle mit simplen Textlinks untereinander soviel Probleme machen kann.
            Ist das normal, daß ich beim NS 7 das so machen muss, nur um eine Grafik in einer Tabelle anzuzeigen? Das war doch vorher nicht so ein Gefummel...

            Weil es vorher niemand dem Standard entsprechend gemacht hat. Erklärung: http://www.dodabo.de/html+css/img-table/

            Ausserdem sollte man nicht mehr für jeden Quatsch eine Layouttabelle machen, es gibt mittels CSS genügend Wege, klassische Layouts umzusetzen. Nebeneffekt (eigentlich Grundlage) ist, das der Inhalt ordentlich strukturiert werden kann, so das er letztlich auch ohne grafischen Browser geniesbar ist.

            Gruß Herbalizer