Pull-up fails for basic long clipped columns with post-column-holder in-flow content in IE 6 and IE 8 beta 1

‘Long clipped columns’ is an important, industry-recognised technique for creating the appearance of equal height in (floated) ‘columns’. It works through giving the columns a large padding-bottom and a large negative margin-bottom, and then setting the column-holder’s overflow to hidden so that all column padding below the ‘pulled-up’ bottom border edge of the column-holder is clipped.

In this minimal test case the column-holder has an orange background, and there is in-flow content after the column-holder. There is only one column: that with the red background. It is not floated.

In IE 6, although the in-flow content after the column-holder is correctly placed below the column’s own in-flow content, the column’s background rendered for approximately 200px before being clipped. Moreover, the column-holder’s background is not clipped at all, and scrollbars allow scrolling to the bottom of the column-holder’s unclipped content area.

In IE 8 beta 1 the column is not clipped, scrollbars allow scrolling to the bottom of the column-holder’s unclipped content area, and the in-flow content after the column-holder is rendered below the column-holder’s unclipped content area.

In IE 7 the pull-up works correctly.

View other IE implementation bugs related to overflow.

Column content.

In-flow content following the column-holder.