CSS: float:left; und overflow:auto; IE6 und kleiner==Problem

Auf IE7, IE8 und allen gängigen Browsern läuft das Problem-Layout um das es geht super (naja, im IE8 haut was auch noch net ganz hin, aber darum geht's jetzt nicht). Nur im IE6.0 und kleinere Versionen das totale Dilemma. Am besten ihr schaut euch das mal an:

So sieht die Seite normalerweise aus:
http://zentrum7.de/screenshots/normal.jpg

Und so auf IE6:
http://zentrum7.de/screenshots/IE6.0.jpg

Weiss jemand wie man das auch für den IE6 hinbekommen kann?

Hier noch der relevante CSS-Code:

div#NaviLeftBox {
	float:left; }


div.sell,
div.news,
div.txtBox {	
	margin:0 0 8px 0; padding:0; overflow:auto;
	color:#000000; background-color:#eeffee;
	border-left:1px solid #99cc99; border-right:1px solid #99cc99;
	border-bottom:1px solid #99cc99; }

Den HTML-Code könnt ihr ja sicher über euren Browser hier betrachten:
http://zentrum7.de/

Wer die kompletten CSS-Angaben sehen will findet ganz unten auf der Startseite einen W3C-CSS Button. Da einfach drauf klicken, der Validator spuckt's aus

Zitat von synaptic

das stylesheet packst du dann mit conditional comments in den head unter das normale stylesheet

Und was hat das für einen Vorteil gegenüber der Methode, die ich verwende?

Zitat von synaptic

welche methode verwendest du? du hast nur 1 (in worten "EIN") stylesheet und wunderst dich wieso der ie6 alles verhackstückelt.....

Ich würde eher sagen, ich habe drei stylesheets in einer Datei. Das finde ich wesentlich übersichtlicher und dürfte den selben Effekt haben wie conditional comments. Die Stylesheets sehen dann so aus wie im folgenden Beispiel. Erst notiere ich das allgemeine Stylesheet, darunter das für den IE6 und darunter das für IE7.

div.sell,
div.news,
div.txtBox {	
	margin:8px 0; padding:0; overflow:auto;
	color:#000000; background-color:#eeffee;
	border-left:1px solid #99cc99; border-right:1px solid #99cc99;
	border-bottom:1px solid #99cc99; }


* html div.sell,
* html div.news,
* html div.txtBox {
	overflow:hidden; }


a.intern {
	margin:0; padding:0 0 0 20px; text-decoration:none; }


* html a.intern {
	height:1%; }


*+html a.intern {
	height:1%; }

Sooo... ich habe mal so langsam die Ursache des Problems gefunden. Es liegt wohl am Peekaboo Bug. Folgendes habe ich jetzt mal in der CSS-Datei notiert:

* html div.news { height:1%; }

Damit gehts nun im IE6.0 so wie es sein sollte. Allerdings greift das nicht so wie es sollte im IE5.5, da sieht es dann nämlich so aus:
http://zentrum7.de/screenshots/IE5.5.jpg

Kann man (die nötige Erfahrung wohl vorrausgesetzt) konkret sagen, welcher Wert in diesem Fall am besten für height angegeben werden sollte? Bis auf auto würde jeder Wert den Peekaboo Bug auflösen. Nur das blöde hierbei ist, dass die meisten Werte wohl eher Unheil anrichten als nützlich zu sein. Zumal die Höhe, je nach Textlänge, dynamisch sein muss. Welchen Wert gebe ich da am besten an? Weiss das jemand?