nicht angemeldet
Hallo Forum,
bin heute auf einen recht interessanten IE-Big gestoßen, über den ich nichts im Archiv gefunden habe, nämlich das Verhalten eines Elements, dass per position:absolute;bottom:0px; (Zahl spielt keine Rolle) ausgelöst wird, wenn das Elternelement nicht body ist und über keine Größenangabe verfügt. Beispielcode:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>test</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<style type="text/css">
.outer {
background-color:#ff0000;
padding:15px;
}
.inner {
position:relative;
background-color:#bbbbff;
}
p {
position: absolute;
bottom:0px;
left:10px;
padding:0;
background-color:#ffff00;
margin:0;
}
</style>
</head>
<body>
<div class="outer">
<div class="inner">
<div>1<br>2<br>3</div>
<p>hallo</p>
</div>
</div>
</body>
</html>
Mozilla und Opera setzten das gelbe "hallo" richtig, bündig mit dem unteren Rand des lilafarbenen Bereichs, IE 5 und 6 befördern es ins Nirvana.
Sobald man aber dem Elternelement, in diesem Fall ".inner" irgendeine Größenangabe verpasst, ist der IE wieder im Bilde, zB so:
.inner {
width:100%;
position:relative;
background-color:#bbbbff;
}
Die Größenangabe kann anscheinend irgendetwas sein, relativ oder absolut, width oder height, egal. Der IE braucht wohl irgend einen Anhaltspunkt. Die anderen 3 Richtungen, top, left und right zeigen dieses Verhalten übrigens nicht.
Ist das ein bekannter bug, gibt es da einen besseren workaround, oder mache ich einen prinzipiellen Denkfehler bei der Sache?
Bei der Gelegenheit kann man übrigens auch feststellen, dass für den IE (auch 5er und 6er) die Angabe bottom:0px; eigentlich 1px bedeutet. Selbst in IE 6 standard comliant mode. *seufz*
Grüße,
Nils