8.3.1 Collapsing margins: The bottom margin of an in-flow block-level element with a 'height' of 'auto' and 'min-height' less than the element's used height and 'max-height' greater than the element's used height is adjoining to its last in-flow block-level child's bottom margin if the element has no bottom padding or border.
Each test has an outer element with light blue background and vertical margins of 25 pixels and an inner element with green background and vertical margins of 50 pixels.
Passed: FF 2.0.0.8, Mozilla 1.7.13, Opera 9.24
Failed: IE 7 & IE 6
IE7 shows it's hasLayout bug which doesn't allow the top margins to collapse thus forcing the inner element with a green background down by the width of it's top margin. IE6 shows it's hasLayout bug which doesn't allow the either the top or bottom margins to collapse thus forcing the outer element with the light blue beackground to expand in height.
<div class="wrapper">
<div class="space"></div>
<div class="outerbox minheight0">
<div class="innerbox">
<div>min-height:0</div>
</div>
</div>
</div>
<div class="space"></div>
</div>
.wrapper {background:url(../../../images/examples/bluehatchback3.gif) 0 5px;}
.outerbox {margin:25px 0;background: url(../../../images/examples/blue2tran.png)}
.innerbox {margin:50px 100px;background: url(../../../images/examples/green1tran2.png)}
.innerbox div {height:25px;}
.heightauto {height:auto;}
.height0 {height:0px;}
.height25 {height:25px;}
.height50 {height:50px;}
.height125 {height:125px;}
.space {height:5px;background:#888}