Chumby.net

Here’s my favorite, easy work-around for the lack of min-height support in Internet Explorer 6.0:

.foo {
width:200px;
height: auto !important; /* Firefox, Safari, IE7, etc */
height: 200px; /* IE6 */
min-height:200px; /* Firefox, Safari, IE7, etc */
border:1px solid #000;
float:left;
}


When IE6 sees multiple definitions of the same attribute, it applies that last one. In this case height: 200px is applied instead of height: auto, despite the !important rule declaration.

Example:

p.foo: Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vestibulum rhoncus pretium dolor. Sed odio sem, auctor quis, condimentum eu, molestie et, mi. Morbi scelerisque tellus sit amet urna. Donec varius. Morbi eu diam. Curabitur facilisis aliquet elit. Vestibulum sed nulla eu arcu cursus blandit. Duis dictum nisl nec lectus. Proin nec metus id dui eleifend tempus. Integer enim.

p.foo: Fusce elit lorem, dignissim non, nonummy et, eleifend id, neque. Donec odio diam, pulvinar ac, fringilla a, lobortis et, elit. Nullam augue nisi, ullamcorper vel, mattis at, sagittis vitae, purus. Vivamus ac velit eget lacus scelerisque fringilla. Pellentesque porttitor, mi a lacinia lacinia, arcu nisi sollicitudin leo, in placerat urna sem id augue. Sed posuere, sapien eget pretium sodales, risus quam dignissim tellus, sit amet tempus nisi lorem eu neque. Aliquam non lorem quis felis semper nonummy. Donec porttitor. Ut scelerisque semper lacus. Etiam rhoncus.