Jochen Kubik: vertikale Zentrierung

Tach Leute,
gibt es eine einfache, und praktikable Lösung für die vertikale Zentrierung in den neuen Browsern? Tabelle auf height="100%" zu setzten ist ja leider nicht mehr(IE/NS6). Meine Navigationselemente sollen in der Mitte sitzen!

Viele Grüße aus Ludwigsburg

JK

  1. Hoi,

    gibt es eine einfache, und praktikable Lösung für die vertikale Zentrierung in den neuen
    Browsern?

    <table height="100%">
     <tr>
      <td valign="middle">
      </td>
     </tr>
    </table>

    Tabelle auf height="100%" zu setzten ist ja leider nicht mehr(IE/NS6).

    Warum nicht?

    Gruesse,
     CK

    1. Hi,
      weil die Geschicht in IE6 und NS6 nicht mehr funkt!
      IE5.5 und NS 4.78 klappts noch!

      Viele Grüße aus Ludwigsburg

      1. Hallo,

        weil die Geschicht in IE6 und NS6 nicht mehr funkt!

        Was heisst 'nicht mehr funkt'?
        Wenn du meinst, dass die Inhalte nicht mehr Vertikal zentriert werden: das ist nicht wahr.

        Gruesse,
         CK

        1. Hallo Christian,

          ich habe Deinencode online gestellt:
          http://www.fotografenmeister.de/tabelle.html

          Bitte schau Dir dies doch mal mit den verschiedenen Browsern an, falls Du nicht die Möglichkeit hast, mache ich Dir gerne auch ein paar screenshots!

          gruß
          JK

          1. Hallo,

            Das liegt am: <!doctype html public "-//W3C//DTD HTML 4.0 //EN">
            Wennst das weg gibst funktioniert es wieder.

            Tsja, das liebe W3C *g*

            Grüße Sonny

            1. Joho,

              Das liegt am: <!doctype html public "-//W3C//DTD HTML 4.0 //EN">
              Wennst das weg gibst funktioniert es wieder.

              Ja, das ist in der Tag ein bekannter Bug(?) im Mozilla.

              Gruesse,
               CK

              1. Hi,

                aber hallo, jetzt funkt's aber !

                Inzwischen habe ich auch die screenshots auf die gleiche seite hochgeladen, falls es euch noch interessiert!

                Ich bedanke mich!

                Leider ist von der ganzen Sache nicht sooooo bekannt :-(((

                Viele Grüße aus Ludwigsburg
                JK

              2. Moin Christian,

                Das liegt am: <!doctype html public "-//W3C//DTD HTML 4.0 //EN">
                Wennst das weg gibst funktioniert es wieder.

                Ja, das ist in der Tag ein bekannter Bug(?) im Mozilla.

                It's not a bug, it's the W3C ;-)

                Eigentlich wollte ich ein altes Posting verlinken ("vertikale Ausrichtung im IE 6", http://forum.de.selfhtml.org/archiv/2001/11/347/), aber der Thread scheint verschütt gegangen zu sein.

                Die Quintessenz eines Postings war:

                <style type="text/css">
                html, body { height:100%; }
                </style>

                Im "Standard-Mode" (bei Angabe einer DTD, sowohl im IE6 als auch im Mozilla/Netscape6) beziehen sich Prozentangaben immer auf die Werte des übergeordneten Elementes. Fehlen die obigen CSS-Angaben, so hat die "Tabellenhöhe 100%" nichts, auf was sie sich beziehen könnte (egal, ob ungültige HTML-Variante <table height="100%"> oder gültige CSS-Variante table {height:100%;})
                Wobei ich noch nicht so recht verstanden habe, was dann das übergeordnete Element zu html ist ;-)

                Viele Grüße
                Carsten

                1. Hoi,

                  Eigentlich wollte ich ein altes Posting verlinken ("vertikale Ausrichtung im IE 6",
                  http://forum.de.selfhtml.org/archiv/2001/11/347/), aber der Thread scheint verschütt
                  gegangen zu sein.

                  Ich hatte nur noch in Erinnerung, <!DOCTYPE> macht da Probleme.

                  Die Quintessenz eines Postings war:

                  <style type="text/css">
                  html, body { height:100%; }
                  </style>

                  Im "Standard-Mode" (bei Angabe einer DTD, sowohl im IE6 als auch im
                  Mozilla/Netscape6) beziehen sich Prozentangaben immer auf die Werte des
                  übergeordneten Elementes. Fehlen die obigen CSS-Angaben, so hat die "Tabellenhöhe
                  100%" nichts, auf was sie sich beziehen könnte (egal, ob ungültige HTML-Variante
                  <table height="100%"> oder gültige CSS-Variante table {height:100%;})

                  Na schau, wieder was gelernt ;-)

                  Ein Tag, an dem man nichts lernt, ist ein verlorener Tag ;-))

                  Gruesse,
                   CK

                  P. S.: (Orginal: Ein Tag, an dem man nicht laechelt, ist ein verlorener Tag; Der Kleine Prinz)

              3. Hallo,

                naja, doch wohl kein Bug. Wenn man dem browser sagt, daß man ihm nun eine html-Seite nach dem Willen des W3C zum verabeiten gibt, dann verarbeitet er das dann auch nach deren Willen. (Was ist eigendlich die Begründung für das "nichtwollen" einer Tabellenhöhenangabe? Keine rethorische Frage, ich denke schon, daß es da einen logischen grund für geben muß....)

                Chräcker

                http://www.Stempelgeheimnis.de

                1. Hi,

                  naja, doch wohl kein Bug. Wenn man dem browser sagt, daß man ihm nun eine html-Seite nach dem Willen des W3C zum verabeiten gibt, dann verarbeitet er das dann auch nach deren Willen. (Was ist eigendlich die Begründung für das "nichtwollen" einer Tabellenhöhenangabe? Keine rethorische Frage, ich denke schon, daß es da einen logischen grund für geben muß....)

                  Der Grund ist, dass der BODY nicht 100% der Fensterinnenhoehe einnimmt, sondern zunaechst mal auf 0px steht. Eine Tabelle mit Inhalt macht den BODY also genauso hoch, wie die Tabelle selbst bzw. wenn diese 100% Hoehe haben soll, dann ist sie eben so hoch, wie sie Platz braucht - das ist dann der logische Grund ;-).

                  Gib mal in die Adresszeile von Netscape 6.x/Mozilla ein:
                  javascript:alert(document.defaultView.getComputedStyle(document.getElementsByTagName('body')[0],"").getPropertyValue('height'));

                  Ohne geladenes Dokument erscheint 0px, mit einer Tabelle entsprechend
                  die Hoehe der Tabelle mit Inhalt.

                  MfG, Thomas

                  1. Hallo,

                    hm, ja, habe ich ansatzwiese (ich denke noch....) verstanden. Aber jetzt mal als "doofer" gefragt. (bzw zwei fragen)

                    Wenn ich es richtig verstanden hätte ;-) (ich denke ja noch), dann bliebe die Frage, warum man dann nicht wenigsten eine Pixelhöhenangabe aufgenommen hat.

                    und das es ja "irgendwie" auch mit dem unlogisvchen 100% geht (100% von was) beweisen ja nun doch einige Broswser, warum hat man nicht die pragmatisch genutzte %-Möglichkeit diverser Browser "in Worte" gefast und aufgenommen?

                    Der Bedarf der Handwerker nach deisem Werkzeug scheint ja da zu sein, "irgendwie" scheinst technisch auch zu gehen, warum nimmt man das dann nicht auf? (aber wahrscheinlich geht die beantwortung dieser Frage dann in die "zulassungs-Absprache-etc-Politik" rein....

                    Chräcker (der dann lieber mit den "Füßen" mitbestimmt und aufs W3C-Label verzichtet....)

            2. Hi,

              was soll denn dann statt dessen da stehen?

              Viele Grüße aus Ludwigsburg

              JK

              1. hi,

                was soll denn dann statt dessen da stehen?

                wenn Du es weglaesst, schalten neuere Browser in den Quirk-Modus und
                interpretieren meist so wie ihre Vorgaenger. Es gibt einige andere
                Problemchen, die man quick und dirty so beheben kann.
                Konformer waere natuerlich die Methode nach Thomas.

                Gruesse  Joachim
                .

  2. Hallo Jochen,

    gibt es eine einfache, und praktikable Lösung für die vertikale Zentrierung in den neuen Browsern? Tabelle auf height="100%" zu setzten ist ja leider nicht mehr(IE/NS6). Meine Navigationselemente sollen in der Mitte sitzen!

    Das Element table kennt kein Attribut height. Verwende besser CSS und height: ...; und beachte http://www.styleassistant.de/tips/tip71.htm.

    MfG, Thomas