Hallo Leute!
Schaut so aus als gäbe es einen Bug in Mozilla, Opera und Konqueror
bei margin-top
Weitere Browser habe ich gerade nicht da zum testen.
Der Quelltext:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Test mit margin-top:100px;</title>
<style type="text/css">
<!--
#foo
{
width:300px;
height:300px;
background-color:#ff0000;
}
#bar
{
margin-top:100px;
margin-left:60px;
width:30px;
height:30px;
background-color:#ffcc00;
}
-->
</style>
</head>
<body>
<div id="foo">
<div id="bar"> </div>
</div>
</body>
</html>
=======================================================
"bar" sollte 100px vom oberen Rand von "foo"
und 60px vom linken rand von "foo" entfernt sein.
Leider schaut es so aus, dass "bar" zwar 60px vom linken
Rand von "foo" entfernt ist,
aber (und das ist der Bug)
_keinen_ Abstand nach oben aufweist.
Also obwohl "bar" margin-top:100px; hat,
hat es keinen Abstand zum "foo" DIV.
Und noch viel schlimmer:
"foo" scheint die Eigenschaft margin-top:100px; von "bar"
auf sich zu beziehen.
Also zeigt "foo" einen Abstand von 100px; nach oben zum
Rand des Browser-Fensters an.
Total verrückt ist,
dass wenn ich dem roten DIV "foo" einen Border zuweise:
border:solid 1px blue;
dann funktioniert es plötzlich wie gewollt,
das rote DIV "foo" ist ganz oben im Browserfenster,
und "bar" zeigt den Abstand von 100px; nach oben an.
Was sagt ihr dazu?
Ist das ein bekannter Bug und sind workarounds vorhanden?
Danke,
Aqua