How can you fix the height of an element in IE 6, and allow hidden content to be scrolled into view?

Question

IE 6 treats the CSS height property as if it were min-height, i.e. if an element has height: 500px applied to it, but its contents are taller than 500px, the element will get taller to accommodate them.

I'm trying to give an element a fixed height, and add a scrollbar to allow the contents to be scrolled into view if necessary.

How can I make IE 6 honour the height assigned to it, and allow content to be scrolled into view?

.myelement {height: 500px; overflow-y: scroll;} works in other browsers, but not IE 6.

Answer 1

overflow-y:scroll; should work on IE6 as well.

<div id='test' style="position:absolute; top:10px;left:50px; width:500px; height:200px;background-color: #ffffff; overflow-y: scroll;">
    <div  style="position: absolute; top: 10px; height: 650px; left: 50px; width: 500px;background-color: #000000;"></div>
</div>

Answer 2

This should work, I've tested it in IE6:

http://jsfiddle.net/tmq3r/

Simply set a height and give it overflow:auto