Hi,
Ich möchte einen div horizontal zentrieren, klappt in Mozi und Opera, IE stellt sich quer:
Nein, er hält sich (ausnahmsweise mal) an die Spezifikation.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Test</title>
<style type="text/css">
<!--
#undergr {top:0px; width:685px; height:100%; z-index:0;
border: solid red;
margin-left:auto;
margin-right:auto;
position:relative; }
-->
</style>
</head>
<body>
<div id="undergr">
fgdgfd
</div>
</body>
</html>
height:100%;
100% von was?
Natürlich, so wie es in der Spezifikation vorgesehen ist, vom Elternelement.
Welche Höhe hat das?
body: keine Höhenangabe, also auto.
100% von auto ergibt: auto;
also wird die Höhe konsequenterweise am Inhalt gemessen.
Setze für Eltern, Großeltern usw. bis hinauf zu html die Höhe auf 100% und Du wirst das gewünschte Ergebnis haben.
(beim html-Element gilt als Elternelement das Fenster, dessen Höhe auf die tatsächliche Fenstergröße gesetzt ist).
Im IE wird das zwar zentriert dargestellt, jedoch ist das div nur eine Zeile hoch. Angabe height:200px; funktioniert zwar, hilft mir aber nicht weiter.
Klar, eine explizite Angabe kann natürlich interpretiert werden.
Lass ich bei DOCTYPE "http://www.w3.org/TR/html4/loose.dtd" weg, stimmt die Höhe allerdings ist der div nicht mehr zentriert.
Tja, dann ist der IE im bug-kompatiblen Modus, sprich, er implementiert die bekannten Bugs älterer Versionen.
Was nun?
Richtig machen. S.o.
Andreas.