romero: <p> erzeugt unerwarteten Rand

Hallo an euch da draußen,

ich stehe mal wieder vor einem großem, für euch kleinem, Problem.

ich möchte, wie auf dieser Seite Mein Hauptproblem erwähnt, mein Script auf IE8 oder höher umstellen.

Ich habe nun mein DOCTYPE auch schon auf strict geändert, aber nun habe ich Probleme, die Tabelle wieder hinzubekommen.

Die Sache, wo es z.Z. hapert ist, dass eine CSS-Anweisung nicht das macht was ich angegeben habe.

Um folgende Tabellenzeile handelt es sich (gilt dann auch für die anderen).

<tr height=50>  
				<td width=10></td>  
				<td colspan=10 id="STL_Meldungen_Fehlerausgabe" valign="middle" align="center" style="display: inline;"><p id="STL_Meldungen_Fehler" class="STL_Meldungen_Fehler"></p></td>  
				<td width=10></td>  
			</tr>

Die CSS-Anweisung dazu lautet wie folgt:

.STL_Meldungen_Fehler {
 height:42px;
 width:1096px;
 margin:0px;
 padding:2px;
 border:2px;
 border-style: inset;
 overflow:scroll;
 overflow-x:hidden;
 color: darkred;
 font-weight: bold;
}

Rein theoretisch müsste er diese Anweisung passgenau in die Spalte einfügen. Ohne irgendwelche zusätzlichen weiteren Pixel.

Ich habe aber mittels offsetHeight rausfinden können, dass aber das Element mit der id="STL_Meldungen_Fehlerausgabe" aber eine Höhe von 52px hat, obwohl ich aber 50px angegeben hab? Lass ich aber die <p>...</p> mit deren Inhalt weg, dann hat er genau diese besagten 50px.

Und nun meine Frage: Wie bewerkstellige ich, dass er keinen weiteren Rand dazuaddiert? Vermute es liegt am <p> (bei <div ebenfalls). Ich brauche aber diesen Absatz, da er unter <td> kein 3D-Rand erstellt, warum auch immer.
Habe auch schon versucht alles auf margin:0px zu setzen, ohne Erfolg, auch padding:0px.

Wenn ich aber überhaupt nix angebe an CSS-Werten, dann verändert sich nix, aber das ist ja nicht der Sinn von mir :)

Helft mir dabei. Danke.

LG Romero

  1. Hi,

    Ich habe nun mein DOCTYPE auch schon auf strict geändert,

    Du lügst also, denn

      		<td width=10></td>  
    

    td hat in strict kein width-Attribut.

      		<td colspan=10 id="STL\_Meldungen\_Fehlerausgabe" valign="middle" align="center" style="display: inline;"><p id="STL\_Meldungen\_Fehler" class="STL\_Meldungen\_Fehler"></p></td>  
    

    Eine einzelne Zelle in einer Tabelle auf display: inline zu setzen dürfte unerwartete Effekte ergeben, weil in einer Tabellenzeile eigentlich nur Elemente mit display: table-cell sinnvoll sind.

    Die CSS-Anweisung dazu lautet wie folgt:
    Rein theoretisch müsste er diese Anweisung passgenau in die Spalte einfügen. Ohne irgendwelche zusätzlichen weiteren Pixel.

    Welche Angaben sind für die td (padding) und die table (border-spacing, border-collapse) gemacht?

    Und nun meine Frage: Wie bewerkstellige ich, dass er keinen weiteren Rand dazuaddiert? Vermute es liegt am <p> (bei <div ebenfalls). Ich brauche aber diesen Absatz, da er unter <td> kein 3D-Rand erstellt, warum auch immer.

    Warum ist da überhaupt eine Tabelle? Nur zu Layout-Zwecken?

    cu,
    Andreas

    --
    Warum nennt sich Andreas hier MudGuard?
    O o ostern ...
    Fachfragen per Mail sind frech, werden ignoriert. Das Forum existiert.
    1. Hi,

      Ich habe nun mein DOCTYPE auch schon auf strict geändert,

      Du lügst also, denn

        		<td width=10></td>  
      

      td hat in strict kein width-Attribut.

      Achso? Aber wie deklariere ich denn dann die Weiten einer Spalte? Doch nicht alles über CSS oder doch?

      Eine einzelne Zelle in einer Tabelle auf display: inline zu setzen dürfte unerwartete Effekte ergeben, weil in einer Tabellenzeile eigentlich nur Elemente mit display: table-cell sinnvoll sind.

      Bisher gab es noch keine unerwarteten Nebeneffekte. Denn dient das nicht nur zum ein- und ausblenden der Spalte?

      Welche Angaben sind für die td (padding) und die table (border-spacing, border-collapse) gemacht?

      Die CSS-Anweisung für table ist wie folgt:

      .Tabelle1 {  
       width:1120px;  
       border:3px;  
       border-style: outset;  
       border-color: lightgrey;  
      }
      

      Für td habe ich keine. Müsste ich diese also machen damit der "Rand" dann weg ist? Also margin sowie padding auf 0px?

      Warum ist da überhaupt eine Tabelle? Nur zu Layout-Zwecken?

      Sie dient halt zu Layout-Zwecken. Weil ich da diverse Sachen besser anordnen kann.

      LG Romero

      1. @@romero:

        nuqneH

        Achso? Aber wie deklariere ich denn dann die Weiten einer Spalte? Doch nicht alles über CSS oder doch?

        Doch. Alles.

        Alles, was mit Darstellung zu tun hat, ist Sache von CSS. Alles.

        [Die Tabelle] dient halt zu Layout-Zwecken. Weil ich da diverse Sachen besser anordnen kann.

        Dieser Gedanke gehört ins Reich der Fabeln, Märchen und Legenden.

        Qapla'

        --
        „Perfektion ist nicht dann erreicht, wenn es nichts mehr hinzuzufügen gibt, sondern wenn man nichts mehr weglassen kann.“ (Antoine de Saint-Exupéry)
        1. Achso? Aber wie deklariere ich denn dann die Weiten einer Spalte? Doch nicht alles über CSS oder doch?

          Doch. Alles.

          Alles, was mit Darstellung zu tun hat, ist Sache von CSS. Alles.

          Und wie spreche ich dann die einzelnen <td>'s an? Mittels <td class="td1"></td>? und dann unter CSS dann:

          .td1 { ... }

          [Die Tabelle] dient halt zu Layout-Zwecken. Weil ich da diverse Sachen besser anordnen kann.

          Dieser Gedanke gehört ins Reich der Fabeln, Märchen und Legenden.

          Es lag jetzt die Betonung auf "ICH", weil ich in CSS noch nicht soo konform bin wie eventuell in HTML.

          LG Romero

          1. Ich habe das Problem behoben.

            Ich habe in der CSS-Anweisung die "td" wie folgt deklariert:

            td { margin:0px; padding:0px }

            Damit haben sich dann die zusätzlichen Freiräume, welche sicherlich automatisch entstanden sind in "Luft" aufgelöst :)

            Trotzdem Danke an euch.

            LG Romero

            1. Om nah hoo pez nyeetz, romero!

              td { margin:0px; padding:0px }

              * td-Elemente können keinen margin-Außenabstand haben. http://wiki.selfhtml.org/wiki/CSS/Eigenschaften/Tabellenformatierung/width
              * 0px ist dasselbe wie 0 Salamischeiben.

              Es reicht also td {padding: 0;}

              Matthias

              --
              1/z ist kein Blatt Papier.

              1. * td-Elemente können keinen margin-Außenabstand haben. http://wiki.selfhtml.org/wiki/CSS/Eigenschaften/Tabellenformatierung/width
                * 0px ist dasselbe wie 0 Salamischeiben.

                Es reicht also td {padding: 0;}

                Ok dann werde ich es rausnehmen.

                Ja klar is 0 gleich 0, egal ob "salamischeiben" oder px. Aber falsch ist es ja nicht, wenn ich es dazuschreibe.

                Aber auch das werde ich wegnehmen. Aber wie sieht es aus wenn ich statt 0 einen nummerischen Wert wie 10 reinschreibe? Klar sind grunddefiniert Pixel angegeben aber sauberer ist es ja schon mit px oder?

                LG Romero

                1. Om nah hoo pez nyeetz, romero!

                  Klar sind grunddefiniert Pixel angegeben

                  Wie kommst du denn darauf? http://wiki.selfhtml.org/wiki/CSS/Wertetypen/Zahlen,_Maße_und_Maßeinheiten

                  Matthias

                  --
                  1/z ist kein Blatt Papier.

        2. @@romero:

          nuqneH

          Achso? Aber wie deklariere ich denn dann die Weiten einer Spalte? Doch nicht alles über CSS oder doch?

          Doch. Alles.

          Alles, was mit Darstellung zu tun hat, ist Sache von CSS. Alles.

          D.h. also es könnte in höheren IE's zu Problemen führen? Aber warum macht es die Weiten trotzdem? Und darin müsste ich also auch die Ausrichtungen, usw. schreiben? Und was ist mit colspan?

          PS: ich teste es gerade in IE6, stelle es aber auf IE8 oder höher um.

          LG Romero

  2. Was hast du auf margin: 0; padding: 0 gesetzt das <p>?

    vielleicht kommt es auch auf die schriftgrößen einstellungen der browser an, gibt mal konrket an zusätzlich <p style="margin: 0; padding: 0; font-size: 10px;" und vergleich mal.

    lg