Top and bottom margins unexpectedly not rendered in Internet Explorer 8
The relevant CSS code for this page is:
body { margin: 0; } #mainWrapper { border: green solid medium; margin: 10%; }
Actual results:
- in IE 6 and in IE 7, there is no bottom margin below the green
bottom-border of this webpage
- in IE 8 beta 1, there is no top margin at the top of the green
top-border of this webpage and there is no bottom margin below the green
bottom-border of this webpage.
Expected results:
there should be a 10% margin (approx. 100px) surrounding all 4 sides of
the green bordered box in this webpage. So, there should be a 10% margin
at the top of the green top-border of this webpage and there should be a
10% bottom margin below the green bottom-border of this webpage.
Reference:
"[A margin] percentage is calculated with respect to the width of the
generated box's containing block. Note that this is true for 'margin-top'
and 'margin-bottom' as well."
CSS 2.1,
section 8.3 Margin properties
Firefox 2.x, Firefox 3, Opera 9.26, Opera 9.50, Safari 3.1, Seamonkey 1.x, Seamonkey 2.x, NS 7.0, NS 7.2, K-meleon 1.x, Konqueror 3.5.8, Epiphany 2.22, Galeon 2.0.4, Hv3 TKHTML alpha 16, Amaya 10.0 build 20080229 all pass this test.
Credit must go to Dorayme for posting this issue in comp.infosystems.www.authoring.stylesheets forum discussion newsgroup the IE 7 Margin Problem message and for his No Expected margin bottom in IE 7 testcase
The relevant CSS code for this page is:
body { margin: 0; } #mainWrapper { border: green solid medium; margin: 10%; }
Actual results:
- in IE 6 and in IE 7, there is no bottom margin below the green
bottom-border of this webpage
- in IE 8 beta 1, there is no top margin at the top of the green
top-border of this webpage and there is no bottom margin below the green
bottom-border of this webpage.
Expected results:
there should be a 10% margin (approx. 100px) surrounding all 4 sides of
the green bordered box in this webpage. So, there should be a 10% margin
at the top of the green top-border of this webpage and there should be a
10% bottom margin below the green bottom-border of this webpage.
Reference:
"[A margin] percentage is calculated with respect to the width of the
generated box's containing block. Note that this is true for 'margin-top'
and 'margin-bottom' as well."
CSS 2.1,
section 8.3 Margin properties
Firefox 2.x, Firefox 3, Opera 9.26, Opera 9.50, Safari 3.1, Seamonkey 1.x, Seamonkey 2.x, NS 7.0, NS 7.2, K-meleon 1.x, Konqueror 3.5.8, Epiphany 2.22, Galeon 2.0.4, Hv3 TKHTML alpha 16, Amaya 10.0 build 20080229 all pass this test.
Credit must go to Dorayme for posting this issue in comp.infosystems.www.authoring.stylesheets forum discussion newsgroup the IE 7 Margin Problem message and for his No Expected margin bottom in IE 7 testcase
This bug has been reported at connect's IE beta feedback as bug 344804.
Update: This bug has been FIXED in Internet Explorer 8 Partner pre-RC1 build 6001.18343 released on December 11th 2008. Otherwise, Internet Explorer 8 Partner pre-RC1 build 6001.18343 PASSES this specific and particular testcase.