Eva: Meine Navbar will nicht, wie ich will. HILFEEEE!

Hallo!

Kann mir jemand erklären, warum ich diese fetten schwarzen Balken zwischen meinen links habe?(sieh Bild unten)

Es handelt sich um ein td-Tag in einer Tabelle, und die einzenen Bilder sind einfach mit <img src="...> eingefügt. Ich hatte anfangs eine extra Tabelle, jedes Bild in seinem eigenen td-tag, doch das sah genauso aus.

Ich habe alle möglichen angaben auf null gesetzt... padding, space, margin-bottom, margin-top... anfangs halt in der Tabelle, jetzt in p-Tags, die die Bilder umschließen. Mit div hats auch nicht gefunzt.

Wer hat noch eine Idee? Wahrscheinlich ist die Lösung total simpel und ich denke schon zu lange darüber nach...

Bin dankbar für alles!

MfG
Eva

  1. Hi

    Kann mir jemand erklären, warum ich diese fetten schwarzen Balken zwischen meinen links habe?(sieh Bild unten)

    Es handelt sich um ein td-Tag in einer Tabelle, und die einzenen Bilder sind einfach mit <img src="...> eingefügt. Ich hatte anfangs eine extra Tabelle, jedes Bild in seinem eigenen td-tag, doch das sah genauso aus.

    Ich habe alle möglichen angaben auf null gesetzt... padding, space, margin-bottom, margin-top... anfangs halt in der Tabelle, jetzt in p-Tags, die die Bilder umschließen. Mit div hats auch nicht gefunzt.

    Wer hat noch eine Idee? Wahrscheinlich ist die Lösung total simpel und ich denke schon zu lange darüber nach...

    Idee: zeig uns den Quellcode (Link oder, wenns wenig ist, copy&paste).

    Andreas

    1. Hi,

      na dann werd ich mal, gibts nen preis??

      erstaml würde ich zur Tabelle zurückkehren und die Line Height per css
      auf mölichst wenige px setzen also in etwa so:

      <td style="lineheight: 2px;"><img src="....."><td>

      außerdem im source keine Zeilenumbrüche zwischen den td und den img tags

      und schlussendlich wäre es neben dem source zu wissen auch hilfreich ob
      es unterschied zwischen den Browsern gibt.

      hab ich jetzt was gewonnen?

      bye eddie

      PS: es klingt alber aber ist wichtig: Sende bitte deine Doctype Zeile
      mit!

      1. Hi,

        na dann werd ich mal, gibts nen preis??

        Das muss ich noch überlegen!

        erstaml würde ich zur Tabelle zurückkehren und die Line Height per css
        auf mölichst wenige px setzen also in etwa so:

        <td style="lineheight: 2px;"><img src="....."><td>

        Oki, könnte aber etwa sdauern, habe die Tabelle nicht gespeichert, fange als nochmal von vorne an... *argh*

        außerdem im source keine Zeilenumbrüche zwischen den td und den img tags

        Nicht, dass ich das provozieren würde... wie unterbinde ich denn Zeilenumbrüche?

        und schlussendlich wäre es neben dem source zu wissen auch hilfreich ob
        es unterschied zwischen den Browsern gibt.

        Es gibt enorme Unterschiede, aber ich bin engstirnig genug, nur Opera und MIE zu beachten, die machen keinen ärger.

        PS: es klingt alber aber ist wichtig: Sende bitte deine Doctype Zeile
        mit!

        Das wird ein neues Layout für meine bestehende Seite, es gibt noch kein Doctype, weil die Sache ja noch nicht fertig ist...

        Danke,
        Eva

        1. Also, ich habe alles wieder in eine Tabelle umgeschrieben...

          <table cellpadding="0" cellspacing="0" align="center" border="0" width="100" height="350">
                  <tr>
                    <td style="lineheight: 0px;"> <img src="1.jpg" border="0" width="102" height="23"> </td>
                  </tr>
                  <tr>
                    <td style="lineheight: 0px;"> <a href="http://www.lycos.de" target="in"> <img src="2.jpg" border="0" width="102" height="24"> </a></td>
                  </tr>
                  <tr>
                    <td style="lineheight: 0px;"> <a href="in.html" target="in"> <img src="3.jpg" border="0" width="102" height="29"> </a>  </td>
                  </tr>
                  <tr>
                    <td style="lineheight: 0px;"> <a href="in.html" target="in"> <img src="4.jpg" border="0" width="102" height="27"> </a></td>
                  </tr>
                  <tr>
                    <td style="lineheight: 0px;"> <a href="in.html" target="in"> <img src="5.jpg" border="0" width="102" height="28"> </a></td>
                  </tr>
                  <tr>
                    <td style="lineheight: 0px;"> <a href="in.html" target="in"> <img src="6.jpg" border="0" width="102" height="28"> </a></td>
                  </tr>
                  <tr>
                    <td style="lineheight: 0px;"> <a href="in.html" target="in"> <img src="7.jpg" border="0" width="102" height="22"> </a></td>
                  </tr>
                  <tr>
                    <td style="lineheight: 0px;"> <a href="in.html" target="in"> <img src="8.jpg" border="0" width="102" height="28"> </a></td>
                  </tr>
                  <tr>
                    <td style="lineheight: 0px;"> <a href="in.html" target="in"> <img src="9.jpg" border="0" width="102" height="22"> </a> </td>
                  </tr>
                  <tr>
                    <td style="lineheight: 0px;"> <a href="in.html" target="in"> <img src="10.jpg" border="0" width="102" height="30"> </a> </td>
                  </tr>
                  <tr>
                    <td style="lineheight: 0px;"> <a href="in.html" target="in"> <img src="11.jpg" border="0" width="102" height="22"> </a></td>
                  </tr>
                  <tr>
                    <td style="lineheight: 0px;"> <a href="in.html" target="in"> <img src="12.jpg" border="0" width="102" height="33"> </a></td>
                  </tr>
                  <tr>
                    <td style="lineheight: 0px;"> <img src="13.jpg" border="0" width="102" height="49"> </td>
                  </tr>
                </table>

          Da sind jetzt noch keine margins drin, sehe aber auch nicht, was die bringen sollten. mHabe außerdem zentral mit css dem body-tag margin und padding=0 zugewiesen...

          Bitte, ich dreh noch durch hier... versuch es schon mehrere Tage lang.

          Danke euch,
          Eva

          1. Ich wusste es!

            Lösung vor der Nase, und dann übersieht man es...

            Ich hatte in meiner zentralen CSS-Datei für td-Tags eine größe von 12pt eingestellt! Ich Trottle, steht jetzt auf 1, und alle sist in Ordnung! Danke, für die Hinweise!

            MfG
            Eva

          2. Hi,

            Also, ich habe alles wieder in eine Tabelle umgeschrieben...

            <table cellpadding="0" cellspacing="0" align="center" border="0" width="100" height="350">
                    <tr>
                      <td style="lineheight: 0px;"> <img src="1.jpg"

            border="0" width="102" height="23"> </td>
            lineheight ist im Gegensatz zu line-height keine CSS-Property
            CSS-Angaben kann man auch zentral ablegen für die ganze Tabelle (falls mehrere Tabellen unterschiedlich formatiert sein sollen, muß man halt mit id oder class arbeiten)
            Die Leerzeichen vor/nach dem img solltest Du auch noch weglassen...
            Bei img-Elementen ist das alt-Attribut vorgeschrieben.

            Analog für alle anderen Tabellenzellen.

            Ach so: table hat kein height-Attribut. Verwende dafür CSS.

            Andreas

        2. Hallo,

          na dann werd ich mal, gibts nen preis??

          Das muss ich noch überlegen!

          Ich bin ein großer Gummibärenfan...

          erstaml würde ich zur Tabelle zurückkehren und die Line Height per css
          auf mölichst wenige px setzen also in etwa so:

          <td style="lineheight: 2px;"><img src="....."><td>

          Oki, könnte aber etwa sdauern, habe die Tabelle nicht gespeichert, fange als nochmal von vorne an... *argh*

          verpasse den td's eine klasse und definiere sie Zentral, geht schneller

          außerdem im source keine Zeilenumbrüche zwischen den td und den img tags

          Nicht, dass ich das provozieren würde... wie unterbinde ich denn Zeilenumbrüche?

          Ein bildchen vs. 1000 Worte...

          <html>
          <head>
           <title>Untitled</title>
          </head>

          <body>
          <table border="2" cellpadding="1" cellspacing="0">
           <tr>
            <td>
            <img src="nicht vorhanden" border="2" widht="20" height="20">
            <img src="auch nicht vorhanden" border="2" widht="20" height="20">
            </td>
           </tr>
          </table>
          <table border="2" cellpadding="1" cellspacing="0">
           <tr>
            <td><img src="nicht vorhanden" border="2" widht="20" height="20"><img src="auch nicht vorhanden" border="2" widht="20" height="20"></td>
           </tr>
          </table>

          </body>
          </html>

          Dann dürfte dir das Prinzip schnell klar werden, hoffe ich :)

          Es gibt enorme Unterschiede, aber ich bin engstirnig genug, nur Opera und MIE zu beachten, die machen keinen ärger.

          Kleine Drachen mag ich auch, genauso wie Gummibären!

          PS: es klingt alber aber ist wichtig: Sende bitte deine Doctype Zeile
          mit!

          Das wird ein neues Layout für meine bestehende Seite, es gibt noch kein Doctype, weil die Sache ja noch nicht fertig ist...

          Das war ein Bug im mozilla, der mittlerweile behoben ist (glaube ich)

          HTH
          bye eddie

          1. Vielen Dank erstmal...

            hat aber alles nichts gebracht, sieht immernoch so aus wie vorher. Das verrückte ist, ich habe so eine Navbar schon mal gemacht... ohne Tabelle, einfach ein Bild hinter das andere gehängt, und da ging es. Und jetzt krieg ich diese Freien Stellen nicht weg... *argh* Ich werd echt sauer von sowas...

            vielleicht weiß ja noch jemand anderes ne Lösung...

            <eva reicht Ed X eine Tüte Gummibärchen>

            Und jetzt ergebe ich mich dem Suff... 4 Wochen Arbeit für dieses Layout(Hatte am Anfang ne Map, da hat alles wunderbar geklappt, doch ich konnte dann keine Buttons verwenden, deshalb die Änderung) und nun is anscheinend alles umsonst... solange keinem ne lösung einfällt.

            MfG
            Eva

            1. Hi,

              vielleicht weiß ja noch jemand anderes ne Lösung...

              nun hast du ja deine Lösung, css sind eine schöne, heimtückische oder
              halt schön heimtückische sache... :-)

              <eva reicht Ed X eine Tüte Gummibärchen>

              dankend erhalten, zuerst sind die roten dran...

              Und jetzt ergebe ich mich dem Suff...

              yupp aber erst noch den stylesheet ändern, denn wenn du zentral für alle
              td's 1pt definierst könnte Textinhalt, der in anderen Tabellenzellen
              steht etwas schlecht zu lesen sein ;-)

              Prost

              bye eddie

    2. Idee: zeig uns den Quellcode (Link oder, wenns wenig ist, copy&paste).

      <tr valign="top" width="800" height="350">
          <td valign="top" align="center" width="100" height="350"> <center>
            <p style="margin-top:0cm; margin-bottom:0cm"> <img src="1.jpg" border="0" width="102" height="23"> </p>
            <p style="margin-top:0cm; margin-bottom:0cm"> <a href="http://www.lycos.de" target="in"> <img src="2.jpg" border="0" width="102" height="24"> </a> </p>
            <p style="margin-top:0cm; margin-bottom:0cm"> <a href="in.html" target="in"> <img src="3.jpg" border="0" width="102" height="29"> </a> </p>
            <p style="margin-top:0cm; margin-bottom:0cm"> <a href="in.html" target="in"> <img src="4.jpg" border="0" width="102" height="27"> </a> </p>
            <p style="margin-top:0cm; margin-bottom:0cm"> <a href="in.html" target="in"> <img src="5.jpg" border="0" width="102" height="28"> </a> </p>
            <p style="margin-top:0cm; margin-bottom:0cm"> <a href="in.html" target="in"> <img src="6.jpg" border="0" width="102" height="24"> </a> </p>
            <p style="margin-top:0cm; margin-bottom:0cm"> <a href="in.html" target="in"> <img src="7.jpg" border="0" width="102" height="22"> </a> </p>
            <p style="margin-top:0cm; margin-bottom:0cm"> <a href="in.html" target="in"> <img src="8.jpg" border="0" width="102" height="28"> </a> </p>
            <p style="margin-top:0cm; margin-bottom:0cm"> <a href="in.html" target="in"> <img src="9.jpg" border="0" width="102" height="22"> </a> </p>
            <p style="margin-top:0cm; margin-bottom:0cm"> <a href="in.html" target="in"> <img src="10.jpg" border="0" width="102" height="30"> </a> </p>
            <p style="margin-top:0cm; margin-bottom:0cm"> <a href="in.html" target="in"> <img src="11.jpg" border="0" width="102" height="22"> </a> </p>
            <p style="margin-top:0cm; margin-bottom:0cm"> <a href="in.html" target="in"> <img src="12.jpg" border="0" width="102" height="33"> </a> </p>
            <p style="margin-top:0cm; margin-bottom:0cm"> <img src="13.jpg" border="0" width="102" height="49"></font> </p> </center>
          </td>

      So, des is der ausschnitt, der am wichtigsten ist, denke ich...

  2. Hi,

    alles steht auf null sagst du?? von border habe ich aber nix gelesen. guck ma ob border auch auf null steht (border="0"), mit den div's sollte es aber auch gehen, denn mit (style="position:absolute;left:xy;top:xy;") sollte das sich pixelgenau einstellen lassen.

    Dem <img> tag kannst du auch eine border einstellen, deshalb setzte die auch mal aus sicherheit auf null.

    wenn du jetzt keine tabelle mehr verwendest, so kommt es auf die zeilen höhe an. ist die zuhoch, so rutscht dein menue (nur <img> + <br>) auseinander.

    poste zur sicherheit lieber nochmals den code.

    DerPilz