Aqua: margin-top - Ein Bug in Mozilla, Opera und Konqueror?

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">&nbsp;</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

  1. Hallo,

    Was sagt ihr dazu?

    klingt ganz danach:

    http://www.edition-w3c.de/TR/1998/REC-CSS2-19980512/kap08.html#heading-8.3.1

    mfg NAG

    --
    signatur
  2. Guten Morgen,

    es scheint mir eine Auslassung in der Definition des Stylesheet vorzuliegen, denn nach Angabe eines Wertes für das Attribut position funktionierte alles wie von Dir erwartet, in meinem <a href="http://websitewartung.de/css.html">Beispiel zu margin-top und margin-left<a> findest Du allerdings eine elegantere Lösung für diesen Fall, sofern ich Dich richtg verstanden habe.

    Gruss,

    GHopper

  3. Hi,

    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.

    Bevor Du mit dem Wort "Bug" rumwirfst, solltest Du Dich erstmal informieren.
    Nur weil sich die Browser anders verhalten als Du es erwartest, heißt nicht, daß sie sich falsch verhalten - es kann auch Deine Erwartung sein, die falsch ist.

    http://www.w3.org/TR/REC-CSS2/box.html#collapsing-margins
    sagt ganz eindeutig, daß das Verhalten der Browser korrekt ist.

    cu,
    Andreas

    --
    Warum nennt sich Andreas hier MudGuard?
    Schreinerei Waechter
    Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.