Alex: DIVs zentrieren

Hallo Ihr

Ich habe eine Seite, auf der zwei DIVs in z-Position übereinander liegen sollen. Das habe ich dank Eurer Hilfe auch hingekriegt.

Leider ergibt sich aus der absoluten Positionierung ein Problem bei der Zentrierung.
Im IE funktioniert folgender Quelltext (obwohl mir unklar ist wieso), er funktioniert jedoch nicht in Netscape, Opera, Firefox,...
weiß jemand Abhilfe (und vorallem eine Erklärung?)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
<HTML><HEAD></HEAD><BODY>

<div id="DAVOR" style="text-align:center;">
<H1>DAVOR</H1>
text text text text text text text text text text text text text text text text <br>
text text text text text text text text text text text text text text text text <br>
text text text text text text text text text text text text text text text text <br>
<br>
</div>
<div id="EINS" style="position:relative;width:100%;height:50px;border:solid 5px #f00;text-align:center;">
         <div id="ZWEI" style="position:absolute;top:0;width:50%;border:solid 5px #0f0;">
            Dieser Text sollte zentriert und deckungsgleich mit dem anderen sein
          </div>
          <div id="ZWEI" style="position:relative;top:0;width:50%;border:solid 5px #0f0;">
            Dieser Text sollte zentriert und deckungsgleich mit dem anderen sein
          </div>
</div>
<div id="DANACH" style="text-align:center;">
<H1>DANACH</H1>
text text text text text text text text text text text text text text text text <br>
text text text text text text text text text text text text text text text text <br>
text text text text text text text text text text text text text text text text <br>
</div>
</BODY></HTML>

Schonmal Danke

Alex

  1. Mal daran gedacht, das ganze übersichtlich als css-class zu definieren, und dann den einzelnen divs zuzuweisen?

    Da ist bestimmt irgendwo nen Formatierungsfehler, zu viele oder zu wenige ";" drin oder ähnliches, der vom IE ignoriert wird.

  2. Hey

    Habe jetzt ein Workaround gebaut, das lediglich bei der Anzeige der Ramen im IE Probleme hat.

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
    <HTML><HEAD></HEAD><BODY>
    <div id="DAVOR" style="text-align:center;">
    <H1>DAVOR</H1>
    text text text text text text text text text text text text text text text text <br>
    <br>
    </div>
    <div id="EINS" style="position:relative;width:100%;height:80px;border:solid 5px #f00;">
       <div id="ZWEI" style="position:absolute;top:20px;width:100%;text-align:center;">
          <span style="margin:10px;padding:15px;border:solid 5px #0f0;">
            Dieser Text sollte zentriert und deckungsgleich mit dem anderen sein
          </span>
       </div>
       <div id="DREI" style="position:absolute;top:20px;width:100%;text-align:center;">
          <span style="margin:10px;padding:15px;border:solid 5px #0f0;">
            Dieser Text sollte zentriert und deckungsgleich mit dem anderen sein
          </span>
       </div>
    </div>
    <div id="DANACH" style="text-align:center;">
    <H1>DANACH</H1>
    text text text text text text text text text text text text text text text text <br>
    </div>
    </BODY></HTML>
    Hat dazu noch jemand ne Idee?

    Gute Nacht

    Alex