height: 100%
height: 50%
parent, height:400px
height: 100%
height: 50%
parent, height:400px; padding-top: 100px
height: 100%
height: 50%
parent, height:400px; padding: 50px 0
height: 100%
height: 50%
parent, height:400px; border-top-w: 100px

This page is the standard mode version of IE, percentage height and box model - quirks.

Similar cases as above, but with some margins on the child boxes. In IE6 the children cause some expansion of the parent box (the percentage height remain computed on the basis of the not expanded box).

height: 100%, m-t: 50px
height: 50%, m-t: 50px
parent, height:400px
height: 100%, m-t: 50px
height: 50%, m-t: 50px
parent, height:400px; padding-top: 100px
height: 100%, m-t: 50px
height: 50%, m-t: 50px
parent, height:400px; padding: 50px 0
height: 100%, m-t: 50px
height: 50%, m-t: 50px
parent, height:400px; border-top-w: 100px

CSS tests home