I have got a div that needs to have a fixed height and will have either floated or non-floated content.I had no issues with the CSS in Firefox and Safari but started having problems with IE6.Im using overflow:hidden to clear the float but the content gets clipped in IE6,so I used zoom to trigger the hasLayout property.The float gets cleared in IE 6 but I need the container to have a fixed height,if I specify a fixed height for the container the content gets clipped.Is it possbile to hav a div container that can have a fixed height and aslo have the overflow:hidden to clear the floats?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style>
#boxContent{background:red;min-height:425px;height:auto !important;height:425px;overflow:hidden;zoom: 1;}
#box1{background:yellow;float:left;width:50%}
#box2{background:green;float:left;width:50%}
</style>
</head>
<body>
<div id="boxContent">
<div id="box1">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam placerat scelerisque purus nec elementum. Maecenas tempus sollicitudin tincidunt. Integer tincidunt volutpat ullamcorper. Etiam laoreet tincidunt nunc, sit amet venenatis est rhoncus vel. Aenean enim dui, blandit eget egestas blandit, blandit id purus. Curabitur non tortor neque, et ornare elit. Mauris at nisi turpis. Vivamus tempus, enim quis posuere laoreet, elit est varius tellus, vel faucibus nunc enim vel lacus. Sed semper feugiat nisi sit amet pulvinar. Duis mattis cursus nunc vel volutpat. Etiam ornare mollis leo ac mattis.
Cras sagittis mauris mi, et pellentesque arcu. Phasellus aliquet nisi sed tortor dictum faucibus. Morbi facilisis pretium lorem, in cursus augue fringilla eu. Morbi felis lectus, commodo at fermentum eget, varius at sem. Aenean dapibus lacus eu orci mollis porttitor. Curabitur nec purus quis risus imperdiet malesuada. Suspendisse potenti. In ipsum lorem, molestie ac sollicitudin at, dignissim eget est. Curabitur arcu eros, accumsan et pretium dignissim, pellentesque eget mi. In fringilla neque pharetra leo imperdiet ut dictum odio hendrerit. Etiam ligula nisl, feugiat vel mattis vel, pulvinar vitae dui.
Cras felis massa, porttitor sed bibendum at, vestibulum in nisi. Nulla egestas hendrerit felis, accumsan imperdiet tellus commodo id. Maecenas tincidunt justo ut erat porta et faucibus ante dapibus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In gravida tristique tristique. Etiam non dolor mi, id eleifend odio. Sed cursus nisl ut enim dictum adipiscing sed volutpat lacus. Quisque ut quam felis, quis vulputate velit. Fusce consequat, metus sed vulputate ultricies, leo leo tempor elit, vitae fringilla odio orci id leo. Sed nec neque nisl, eu fermentum arcu. Nunc facilisis scelerisque ipsum dictum feugiat. In hac habitasse platea dictumst. Pellentesque et nisl lacus, nec vulputate turpis. Nulla volutpat faucibus arcu et dapibus. Integer in erat libero, quis dignissim magna. Mauris metus felis, suscipit in euismod at, congue quis libero.
Vestibulum volutpat aliquet ligula commodo dignissim. Donec laoreet quam et massa consequat scelerisque viverra turpis tincidunt. Morbi quis leo lacus, at porttitor nunc. Fusce fermentum elementum felis id viverra. Sed semper varius convallis. Duis quam lorem, facilisis id consequat in, commodo eget diam. Curabitur dolor elit, volutpat id tincidunt vel, rutrum eu arcu. Fusce scelerisque gravida porttitor. Duis accumsan porttitor fermentum. Integer fringilla tincidunt ipsum, sed condimentum diam consequat in. Maecenas malesuada lacinia nisi, eu condimentum lectus molestie pretium. Sed quam nisi, blandit non pretium in, luctus id quam. Morbi ac feugiat orci. In ac convallis ipsum.
</p>
</div>
<div id="box2">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam placerat scelerisque purus nec elementum. Maecenas tempus sollicitudin tincidunt. Integer tincidunt volutpat ullamcorper. Etiam laoreet tincidunt nunc, sit amet venenatis est rhoncus vel. Aenean enim dui, blandit eget egestas blandit, blandit id purus. Curabitur non tortor neque, et ornare elit. Mauris at nisi turpis. Vivamus tempus, enim quis posuere laoreet, elit est varius tellus, vel faucibus nunc enim vel lacus. Sed semper feugiat nisi sit amet pulvinar. Duis mattis cursus nunc vel volutpat. Etiam ornare mollis leo ac mattis.
Cras sagittis mauris mi, et pellentesque arcu. Phasellus aliquet nisi sed tortor dictum faucibus. Morbi facilisis pretium lorem, in cursus augue fringilla eu. Morbi felis lectus, commodo at fermentum eget, varius at sem. Aenean dapibus lacus eu orci mollis porttitor. Curabitur nec purus quis risus imperdiet malesuada. Suspendisse potenti. In ipsum lorem, molestie ac sollicitudin at, dignissim eget est. Curabitur arcu eros, accumsan et pretium dignissim, pellentesque eget mi. In fringilla neque pharetra leo imperdiet ut dictum odio hendrerit. Etiam ligula nisl, feugiat vel mattis vel, pulvinar vitae dui.
Cras felis massa, porttitor sed bibendum at, vestibulum in nisi. Nulla egestas hendrerit felis, accumsan imperdiet tellus commodo id. Maecenas tincidunt justo ut erat porta et faucibus ante dapibus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In gravida tristique tristique. Etiam non dolor mi, id eleifend odio. Sed cursus nisl ut enim dictum adipiscing sed volutpat lacus. Quisque ut quam felis, quis vulputate velit. Fusce consequat, metus sed vulputate ultricies, leo leo tempor elit, vitae fringilla odio orci id leo. Sed nec neque nisl, eu fermentum arcu. Nunc facilisis scelerisque ipsum dictum feugiat. In hac habitasse platea dictumst. Pellentesque et nisl lacus, nec vulputate turpis. Nulla volutpat faucibus arcu et dapibus. Integer in erat libero, quis dignissim magna. Mauris metus felis, suscipit in euismod at, congue quis libero.
Vestibulum volutpat aliquet ligula commodo dignissim. Donec laoreet quam et massa consequat scelerisque viverra turpis tincidunt. Morbi quis leo lacus, at porttitor nunc. Fusce fermentum elementum felis id viverra. Sed semper varius convallis. Duis quam lorem, facilisis id consequat in, commodo eget diam. Curabitur dolor elit, volutpat id tincidunt vel, rutrum eu arcu. Fusce scelerisque gravida porttitor. Duis accumsan porttitor fermentum. Integer fringilla tincidunt ipsum, sed condimentum diam consequat in. Maecenas malesuada lacinia nisi, eu condimentum lectus molestie pretium. Sed quam nisi, blandit non pretium in, luctus id quam. Morbi ac feugiat orci. In ac convallis ipsum.
</p>
</div>
</div>
</body>
</html>
http://jsfiddle.net/hLwy8/10/
http://jsfiddle.net/hLwy8/11/
overflow:hidden hack does not work in ie6!
you need old style clear:both; at the end of the container