Mastershrimp: IE: 70%-breites DIV zentrieren...

Hallo!

Ich habe für bestimmte div's folgende Styleangaben definiert:

DIV.error { text-align:center; margin:auto; border-style:solid; border-width:1px; border-color:#000000; font-size:10pt; font-family:Arial,Verdana,sans-serif; font-weight:bold; color:#000000; padding:10px; width:70%; }

Ich möchte nun, dass dieses DIV mit der Breite von 70% auf dem Bildschirm zentriert wird - in Mozilla klappt das auch wunderbar. Nur im IE nicht.

Ich dachte eigentlich dass der IE mit der Angabe text-align:center auch  nicht-Text-Elemente zentrieren kann...Hier irgendwie nicht. Auch das dafür vorgesehene margin:auto klappt nur in Mozilla

Weiß jemand Rat?

Gruß

Mastershrimp

  1. Hallo,

    Ich möchte nun, dass dieses DIV mit der Breite von 70% auf dem Bildschirm zentriert wird - in Mozilla klappt das auch wunderbar. Nur im IE nicht.

    Versuch's mal mit:

    div { width:70%; margin-left:15%; margin-right:15%; }

    Das waere fuer mich das naheliegendste...

    Ich dachte eigentlich dass der IE mit der Angabe text-align:center auch  nicht-Text-Elemente zentrieren kann

    Logisch. Es bezieht sich auf den _Inhalt_ des Blocks,
    nicht auf die Ausrichtung des Blocks selbst.

    Du musst es - wenn schon - fuer das Element, in welchem
    der DIV enthalten ist, angeben, z.B. fuer body.

    Vielleicht helfen Dir die Ansaetze und Links auf meiner Seite weiter:
    http://www.tiptom.ch/homepage/faq.html?q=tabzentriert

    Gruesse,

    Thomas

    --
    Bitte keine Mails mit Fachfragen - dafuer gibt es das Forum!
    Ich mag es, wenn URLs verlinkt sind (</faq/#Q-19>).
    Oft gestellte PHP-Fragen beantwortet die dclp-FAQ bestens: http://www.dclp-faq.de/
    1. Hallo,

      Ich möchte nun, dass dieses DIV mit der Breite von 70% auf dem Bildschirm zentriert wird - in Mozilla klappt das auch wunderbar. Nur im IE nicht.

      Versuch's mal mit:

      div { width:70%; margin-left:15%; margin-right:15%; }

      Das hat irgendwie die 70% zu ca. 50% gestaucht und rechts einen größeren Platz gelassen als links.

      Das waere fuer mich das naheliegendste...

      Hörte sich auch plausibel an. Naja. Ist halt der IE

      Ich dachte eigentlich dass der IE mit der Angabe text-align:center auch  nicht-Text-Elemente zentrieren kann

      Logisch. Es bezieht sich auf den _Inhalt_ des Blocks,
      nicht auf die Ausrichtung des Blocks selbst.

      Margin:auto müsste doch eigentlich den Block selbst zentrieren, oder?  Mozilla macht's ja auch.

      Du musst es - wenn schon - fuer das Element, in welchem
      der DIV enthalten ist, angeben, z.B. fuer body.

      Ich habe es jetzt mit einem zweiten Div gelöst. Wenn ich den Body zentriert hätte, hätte ich 1000 Sachen ändern müssen.

      Danke euch beiden!

      Gruß

      Mastershrimp

      1. Hallo,

        div { width:70%; margin-left:15%; margin-right:15%; }
        Das hat irgendwie die 70% zu ca. 50% gestaucht und rechts einen größeren Platz gelassen als links.

        Achso, ich hatte das kaputte Box-Modell des MS IE vergessen...

        Margin:auto müsste doch eigentlich den Block selbst zentrieren, oder?  Mozilla macht's ja auch.

        margin-left:auto; margin-right:auto;
        oder kurz:
        margin:0 auto;
        kann der MS IE 6.0 offenbar auch endlich, aber offenbar nur
        im Standards Compliant Mode.

        Wenn Du einen aelteren MS IE hast, oder wenn Du den 6er
        in den Quirks-Modus schickst (worauf auch der Box Model
        Bug hindeutet), dann hast Du Pech gehabt...

        Ich habe es jetzt mit einem zweiten Div gelöst. Wenn ich den Body zentriert hätte, hätte ich 1000 Sachen ändern müssen.

        Nicht unbedingt.
        div { text-align:left; } haette die allgemeine Zentriererei
        ja wieder aufgehoben.

        Aber auch egal - Deine DIV-Suppe musst Du selbst ausloeffeln! ;-)

        Freundliche Gruesse,

        Thomas

        1. Achso, ich hatte das kaputte Box-Modell des MS IE vergessen...

          Wenn Du einen aelteren MS IE hast, oder wenn Du den 6er
          in den Quirks-Modus schickst (worauf auch der Box Model
          Bug hindeutet), dann hast Du Pech gehabt...

          »»
          Echt mal ein tolles Stück Programm-Code, der IE! Mal sehen, was in v.7 (sofern es denn irgendwann mal kommt) alles nettes drin steckt.

          Nicht unbedingt.
          div { text-align:left; } haette die allgemeine Zentriererei
          ja wieder aufgehoben.

          Mh. Ja. Ok. Ach ich lass es jetzt so.

          Aber auch egal - Deine DIV-Suppe musst Du selbst ausloeffeln! ;-)

          :D

          Werd ich.

          Gruß

          Mastershrimp

  2. Hi,

    Ich dachte eigentlich dass der IE mit der Angabe text-align:center auch  nicht-Text-Elemente zentrieren kann...Hier irgendwie nicht.

    aber sicher doch, nur daß er den Inhalt des DIVs zentriert...
    wenn es in allen IEs klappen soll, dann setze entweder text-align:center für body oder margin:0 14.8% für das div.

    freundliche Grüße
    Ingo

  3. MAch doch einfach ein div mit 100% und mach ne Tabelle mit 70% rein.
    Die kannst du ja  dann wunderbar zentreren!
    Müsste doch das sein, was du willst, oder?

    Andy

    1. Hallo.

      Müsste doch das sein, was du willst, oder?

      Wenn gleichzeitig semantisch ausgezeichnet werden soll, sicher nicht.
      MfG, at