smashi: Fehler bei berechnung von margin prozent angaben?

Hallo, ich habe heute mal wieder versucht eine Möglichkeit gesucht etwas vertikal zu zentrieren und zwar unabhängig von der höhe.

Dabei ist mir folgendes Phänomen aufgefallen das ich mir nicht erklären kann.
Ich habe 2 verschachtelte DIV, das erste ist 200px breit und 50px hoch, das zweite soll dann 50% Abstand nach oben haben.
Doch aus irgendeinem Grund nimmt der statt von der höhe die 50% von der breite, also ein margin-top von 100px statt 25px.

Der Code ist valide und man kann es auch leider nicht auf einen Browser schieben, es zeigen alle (IE6, IE7, FF und Opera) so an.

Ist das so gewollt oder ein Bug????

Gruß smashi

<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
* { margin:0; }
#first {border:1px solid red; width:200px; height:50px;}
#second {border:1px solid green; margin-top:50%;}
</style>
</head>
<body>
<div id="first">
  <div id="second">a</div>
</div>
</body>
</html>

  1. Hi,

    Doch aus irgendeinem Grund nimmt der statt von der höhe die 50% von der breite,

    der Grund ist, dass dies exakt so definiert wurde.

    <?xml version="1.0"?>

    Warum versetzt Du den IE in den Quirks-Mode?

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    1. aber was hat denn bitteschön margin-top mit width zu tun???
      kannst du mir das logisch erklären???

      es ist egal ob quirks mode oder nicht, wird immer so angezeigt!!!

      gruss smashi

      Hi,

      Doch aus irgendeinem Grund nimmt der statt von der höhe die 50% von der breite,

      der Grund ist, dass dies exakt so definiert wurde.

      <?xml version="1.0"?>

      Warum versetzt Du den IE in den Quirks-Mode?

      Cheatah

      1. hi,

        bitte zitiere vernünftig.

        aber was hat denn bitteschön margin-top mit width zu tun???

        http://www.w3.org/TR/CSS21/box.html#margin-properties

        es ist egal ob quirks mode oder nicht, wird immer so angezeigt!!!

        Wenigstens das macht dein Testbrowser im Quirks Mode also nicht falsch.

        gruß,
        wahsaga

        --
        /voodoo.css:
        #GeorgeWBush { position:absolute; bottom:-6ft; }
        1. hi,

          bitte zitiere vernünftig.

          sorry :-)

          aber was hat denn bitteschön margin-top mit width zu tun???

          http://www.w3.org/TR/CSS21/box.html#margin-properties

          na gut wenns da steht merk ichs mir, logisch find ichs aber nicht

          smashi