Paul Brunner: DIV zentrieren

Guten Tag,

von all den vielen Problemchen die sich ergeben beim Versuch
ein CSS-Layout für die gänigsten Browser zu erstellen hält sich
eines besonders hartnäckig:

*--------------
<body style="text-align:center;">
  <div style="text-align:left;width:650px;">
    Ich bin ein div und soll in der Fenster-Mitte stehen, während
    mein Inhalt linksbündig sein soll.
  </div>
</body>
*--------------

-IE5.5 kanns
-OP5.11 und NN6 lassen sich durch nichts
 dazu bewegen und zeigen den ganzen Block linksbündig
-NN4 machts nur (nicht lachen) wenn für
 das div ein border definiert ist

Wo bleibt denn da die Logik, das is ja albern!
Paul

  1. Hallo Paul,

    <body style="text-align:center;">
      <div style="text-align:left;width:650px;">
        Ich bin ein div und soll in der Fenster-Mitte stehen, während
        mein Inhalt linksbündig sein soll.
      </div>
    </body>
    *--------------

    mit text-align kannst Du den Inhalt von Block-Level-Elementen mittig
    ausrichten, nicht aber diese selbst. In Deinem Fall wäre margin:auto;
    für das DIV die richtige Wahl, mußt Du mal schauen, welcher Browser
    sowas (nicht) kann.

    Viele Grüße,
    Stefan

    1. Schmatz,

      Opera und Mozilla unterstützen margin:auto; Explorer und NN4 ignorieren es freundlicher weise.

      Drei verschiedene Methoden für vier Browser um eine Sache zu erreichen: Hoch leben die Standards! Hauptsache es funktioniert.

      Danke
      Paul

      1. Hallo Paul,

        Opera und Mozilla unterstützen margin:auto; Explorer und NN4 ignorieren es freundlicher weise.

        die Mehrheit entscheidet ;-)

        Hoch leben die Standards!

        Genau, und soviel zum Thema "IE und CSS". Aber imho ist es beim IE6 mittlerweile auch so weit, daß ein Browser aus dem Hause Microsoft diesen wunderbaren Standard versteht (evtl. aber nur mit Doctype-Deklaration).

        Viele Grüße
        Carsten

        1. Hello again,

          die Mehrheit entscheidet ;-)

          Irgendwie kann ich nicht mehr zählen...
          (der Rest behält aber seine Gültigkeit ;-)

          Viele Grüße
          Carsten

      2. Schmatz,

        Opera und Mozilla unterstützen margin:auto; Explorer und NN4 ignorieren es freundlicher weise.

        ach? der hyper-ultratolle IE kann nichteinmal margin:auto ??

        na dann gute Nacht!

        1. Hallo kai!

          der hyper-ultratolle IE kann nichteinmal margin:auto ??

          In der Tat. Da ich es aber anders in Erinnerung hatte, habe ich noch einmal http://www.thenoodleincident.com/tutorials/box_lesson/basic_centered.html aufgerufen, da dort eine Box zentriert war - auch im IE. Aber siehe dort: ein "text-align:center" im body... nur deswegen können Mozilla und IE dieses Beispiel gleichermaßen zentriert darstellen!

          Patrick

          1. Hallo Patrick,

            »Aber siehe dort: ein "text-align:center" im body... nur deswegen können Mozilla und IE dieses Beispiel gleichermaßen zentriert darstellen!

            das kann ich bestätigen:
            OP5 und NN6 kommen mit margin:auto zurecht
            IE5 zentriert mit text-align:center im body
            und NN4 braucht zusätzlich zu der Angabe im Body nochmal die selbe Angabe im zugehörigen div selbst und muss einen Rahmen haben.

            Weitere Risiken und Wechselwirkungen habe ich nicht ausgetestet.

            Gruß
            Paul