From:  "Stanimir Stamenkov" <stanio@gbg.bg>
Date:  22 Sep 2005 18:34:20 Hong Kong Time
Newsgroup:  news.mozilla.org/netscape.public.mozilla.layout
Subject:  

Re: More on the root element and the initial containing block - vertical margin collapsing

NNTP-Posting-Host:  83.228.3.106

[x-posting to c.i.w.a.stylesheets, followup-to c.i.w.a.stylesheets]

/Stanimir Stamenkov/:

> http://stanio.info/viewport_fill.html
>
> Now, the example DIV element has top and bottom margins of 3em and
> 'height: 30%'. What I observe in Mozilla (actually SeaMonkey 1.0 Alpha)
> and Opera 8.02 is the appearance of a vertical scroll-bar for the
> viewport adding about 3em of height to scroll. IE 6 doesn't show a
> scroll-bar.

I think I've got it. I've made another sample:

http://stanio.info/viewport_fill2.html

So, the DIV element is collapsing margin with the BODY element (as seen
by differntly colored backgrounds) were the extra height comes from.
Turns out Internet Explorer to be incorrect(?) in this case, acting
somewhat between the initial CSS 2 recommendation and the latest CSS
2.1 revision. Opera still gives that strange bottom margin when the
root (HTML) element doesn't have a border:

http://stanio.info/viewport_fill_opera1.html
http://stanio.info/viewport_fill_opera2.html

A somewhat consistent behavior is achieved setting 'overflow: auto' on
both HTML and BODY elements:

http://stanio.info/viewport_fill3.html

In this case I'm not really sure how the "margin collapsing" is
supposed to work (between the element with 'overflow: auto' and the
child element which margin overflows) and Opera is far different than
Moz or IE, again:

http://stanio.info/viewport_fill4.html

-- 
Stanimir