Janis Wojtusch: Unterschiedliches Interpretation des height-Attributes

Hallo,

ich habe mir eine Struktur für eine HTML-Seite überlegt und umgesetzt, aber sie wird leider in unterschiedlichen Browsern unterschiedlich dargestellt:

Ich habe ein Tabelle mit zwei Zeilen und drei Spalten erstellt. Dabei sind die beiden übereinanderliegenden Zellen in der Mitte und rechts mit rowspan zusammengefügt. Dabei soll in der rechten Spalte der eigentlich Text stehen, in der Mittelspalte (nur 1 Pixel breit) befindet sich eine Trennlinie. Die linken Zellen sollen die Überschrift des Textes tragen. Die obere linke Zelle soll konstant z.B. 100px hoch sein und die untere den Rest der Höhe des Textes ausfüllen. Damit soll die Überschrift immer auf einer festen Höhe zum Seitenbeginn bei beliebig langem Text gehalten werden. Klingt jetzt wahrscheinlich komplizierter als es eigentlich ist - unten ist eine Grafik zur Struktur.

Und hier der Quelltext der Tabelle:

<table align="center" border="1" cellpadding="0" cellspacing="20" width="690">
  <tr>
   <td align="center" width="260" height="100"></td>
   <td width="1" rowspan="2" background="trennlinie.jpg"></td>
   <td width="349" rowspan="2">

...ganz langer Text hier...

</td>
  </tr>
  <tr>
   <td align="center" valign="top">&Uuml;berschrift</td>
  </tr>
</table>

Eine Testseite mit langem Text: http://217.7.119.98/wojtusch/test.html

In Opera wird das Ganze auch so dargestellt, wie ich das haben möchte nur im Internet-Explorer rutscht mir die Überschrift immer in die Mitte vom Text und damit aus dem Blickfeld, wenn man die Seite aufruft. Ich weiß, dass das height-Attribut eigentlich nicht mehr unbedingt aktuell ist, aber wie mache ich es sonst?

Vielen Dank für's Durchlesen bis zum Ende und hoffentlich hilfreiche Antworten ;)

Gruß

Janis

  1. Hi,

    Ich habe ein Tabelle mit zwei Zeilen und drei Spalten erstellt. Dabei sind die beiden übereinanderliegenden Zellen in der Mitte und rechts mit rowspan zusammengefügt. Dabei soll in der rechten Spalte der eigentlich Text stehen, in der Mittelspalte (nur 1 Pixel breit) befindet sich eine Trennlinie. Die linken Zellen sollen die Überschrift des Textes tragen.

    Klingt so, als wolltest Du ein links-floatendes h1 (oder h2 oder ... h6) neben dem Textabsatz (der eine linke border hat und einen linken margin in Breite der Überschriften) haben.

    Nach Tabelle klingt das überhaupt nicht.

    cu,
    Andreas

    --
    Warum nennt sich Andreas hier MudGuard?
    Schreinerei Waechter
    Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
    1. Hallo Andreas,

      danke für Deine Antwort, aber vielleicht habe ich mich da etwas unklar ausgedrückt: Die Überschrift soll eben nicht fließen, sie soll in einem festen Abstand zum oberen Seitenrand stehen. Die Lösung mit Tabellen beruht hauptsächlich darin, dass es für das übrige Layout drumherum nötig ist, dieses Problem bezieht sich nur auf einen Ausschnitt der Seite.

      Klingt so, als wolltest Du ein links-floatendes h1 (oder h2 oder ... h6) neben dem Textabsatz (der eine linke border hat und einen linken margin in Breite der Überschriften) haben.

      Nach Tabelle klingt das überhaupt nicht.

      cu,
      Andreas

      1. Zusatz:  Die Überschrift soll zwar in einem festen Abstand zum oberen Seitenrand stehen, aber beim Scrollen soll die Überschrift dabei nicht immer sichtbar sein. Also quasi wie eine um z.B. 100px nach unten versetzte Überschrift.

      2. Hi,

        danke für Deine Antwort, aber vielleicht habe ich mich da etwas unklar ausgedrückt: Die Überschrift soll eben nicht fließen, sie soll in einem festen Abstand zum oberen Seitenrand stehen. Die Lösung mit Tabellen beruht hauptsächlich darin, dass es für das übrige Layout drumherum nötig ist, dieses Problem bezieht sich nur auf einen Ausschnitt der Seite.

        Hast Du Dich überhaupt ernsthaft mit meinem Vorschlag beschäftigt?

        cu,
        Andreas

        --
        Warum nennt sich Andreas hier MudGuard?
        Schreinerei Waechter
        Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
        1. Wenn ich Dich richtig verstanden habe, meintest Du eine Überschrift, die beim Scrollen mitgeht/mitfließt (to float - fließen) und damit scheinbar immer an der selben Stelle auf dem Bildschirm steht. Oder wie hast Du das gemeint?

          Gruß

          Janis

          1. Wenn ich Dich richtig verstanden habe, meintest Du eine Überschrift, die beim Scrollen mitgeht/mitfließt (to float - fließen) und damit scheinbar immer an der selben Stelle auf dem Bildschirm steht. Oder wie hast Du das gemeint?

            Nein, das ist position:fixed
            float:... heißt der restliche Inhalt fließt um das Element. entweder links oder rechts.

            Struppi.

          2. Hi,

            Wenn ich Dich richtig verstanden habe, meintest Du eine Überschrift, die beim Scrollen mitgeht/mitfließt (to float - fließen) und damit scheinbar immer an der selben Stelle auf dem Bildschirm steht. Oder wie hast Du das gemeint?

            So wie Du es haben wolltest, nur ohne unsinnige Tabelle.
            Warum hast Du nicht mal ausprobiert oder nachgelesen, was ich vorgeschlagen habe?

            cu,
            Andreas

            --
            Warum nennt sich Andreas hier MudGuard?
            Schreinerei Waechter
            Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
            1. Ok, sorry, war ein Fehler, habe mich da wohl von meinen Englischkenntnissen zu einer vorschnellen Deutung Deines Vorschlags hinreißen lassen.

              Ich habe mich jetzt mal versucht auf die Schnelle schlau zu machen, es geht um CSS-Layouts, richtig? Da ich diesen Fehler bei der Darstellung - in Opera funktioniert es ja so wie ich es will - erst relativ spät bemerkt habe, würde ich es trotzdem gerne mit einer Tabelle lösen, ansonsten müsste ich jetzt nochmal an die 20 Seiten ändern.

              Gibt es da irgendeine Möglichkeit oder bleibt mir wirklich nur die Umstellung auf CSS?

              P.S. Habe da noch etwas in SelfHTML gefunden: "Leider können selbst manche aktuellen Browser die neu hinzugekommenen Gestaltungsmöglichkeiten von CSS Level 2 noch immer nicht 100%ig umsetzen. Besonders der Internet Explorer weist diesbezüglich große Lücken und Abweichungen vom Standard auf."

              Könnte mir da am Ende nicht genau das gleich blühen: Im IE funktioniert es nicht?

              1. Hi,

                Da ich diesen Fehler bei der Darstellung - in Opera funktioniert es ja so wie ich es will - erst relativ spät bemerkt habe, würde ich es trotzdem gerne mit einer Tabelle lösen, ansonsten müsste ich jetzt nochmal an die 20 Seiten ändern.

                Nutze doch einen Editor, der dateiübergreifendes Suchen&Ersetzen beherrscht.

                Gibt es da irgendeine Möglichkeit oder bleibt mir wirklich nur die Umstellung auf CSS?

                Möglicherweise. Aber di Umstellung ist um so leichter, je rüher Du damit anfängst.

                Könnte mir da am Ende nicht genau das gleich blühen: Im IE funktioniert es nicht?

                Nein. Sowas simples kann selbst der IE.

                freundliche Grüße
                Ingo

                1. Nagut, dann werde ich mal... vielen Dank für die hilfreichen Antworten!

                  Gruß

                  Janis