Probleme mit Hintergrundbildern in IE6

Bei der Seite, die ich aktuell erstellt habe, ist ein interessantes Problem aufgetreten.

Mein HTML-Code (an der entscheidenden Stelle) sieht ungefähr so aus:

<div id="content">
	<div id="content3cols">
		<div class="wrapper">
			<div class="column column1">
				<h1>Spalte 1</h1>
			</div>
			<div class="column column2">
				<h1>Spalte 2</h1>
			</div>
			<div class="column column3">
				<h1>Spalte 3</h1>
			</div>
			<div class="clear"></div>
		</div>
	</div>
</div>

Da die Spalten alle die gleiche Höhe haben sollten, unabhängig vom Inhalt, habe ich in den Container #content3cols ein Hintergrundbild mit den 3 Spalten reingelegt. Zusätzlich hat jede Spalte oben ein Headerbild, was ich über ein Hintergrundbild im Container wrapper gelöst habe.

#content3cols {
	background-image: url(../gfx/bg_content_3cols.gif);
	background-position: 0 0;
	background-repeat: repeat-y;
}
#content3cols .wrapper {
	background-image: url(../gfx/bg_content_3cols_top.gif);
	background-position: 0 0;
	background-repeat: no-repeat;
}

In Firefox/Opera/Safari sah diese Lösung gut aus und verursachte keine Probleme. Im IE6 aber saß das Hintergrundbild irgendwie mittig und wurde nicht nach unten aufgezogen. Und dann hats „Zoom“ gemacht – das ist die Lösung (gefunden dank Google http://codingforums.com/showthread.php?t=131268):

#content3cols {
	zoom: 1;
}
#content3cols .wrapper {
	zoom: 1;
}