Hintergrundbild soll immer 100% des body haben, z-index macht im IE6 Probleme

315 · #1 (**permalink**) 10.06.2010, 11:04

Hallo,

es geht um folgende Seite: http://www.fewo-rothe.de

In so gut wie allen Browsern wird das so angezeigt wie ich es haben will, z.B. im Firefox. Das Hintergrundbild soll immer 100% des body haben.

Allerdings hat meine Lösung im IE6 Probleme mit dem z-index. Oben wird das Hintergrundbild angezeigt und dadrunter der Container, der eigentlich über dem Hintergrundbild liegen soll und den Content enthält. Hier ein Bild:

CSS-Code:

Code:

#background{
	position: fixed;
	z-index: -1;
	width: 100%;
	height: 101%;
}

HTML-Code:

<div>
	<img id="background" src="/images/bg_wiese.jpg" alt="" /> 
</div>

Ich hatte es vorher so gelöst, dass der Hintergrund über die CSS eingebunden wurde, was ich eigentlich schöner finde und dann auch kein Problem mit dem IE6 hat, nur funktioniert dann die Skalierung des Hintergrundes nicht mehr.
Denn ich im Grunde bräuchte ich eine CSS Eigenschaft wie "background-width", aber die gibt es ja nicht.

Also hier nochmal der auskommentierte CSS Code:

Code:

body {
/*	background-image: url(images/bg_wiese.jpg);
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: 100% 100%; */
	background-color: #738239;
	font-size: 0.8em;
	font-family: Verdana, Arial, Sans-Serif;
	color: #555555;
	margin: 0;
	padding: 0;
	min-height: 101%;
}

Wäre toll wenn ihr da ne Lösung für mich hättet, danke!

heiko_rs · #2 (**permalink**) 10.06.2010, 13:28

Der IE < 7 kennt für die Eigenschaft position den Wert "fixed" nicht, daher steht Deine Grafik statisch da und schiebt alles andere nach unten (hat nichts mit dem z-index zu tun). Funktionierende Lösung z.B. stu nicholls | CSS PLaY | 100% wide/high 'background' image emulation

315 · #3 (**permalink**) 14.06.2010, 18:48

Hallo,

vielen Dank. Also der Seite hatte ich meinen Code, aber aus irgendeinem Grund, den ich jetzt nicht mehr kenne, hatte ich das absolute in fixed geändert.

Könnt ihr mir vielleicht auch noch sagen, wie ich auch die Unterseiten "Kontakt" und "Preise" im IE6 vernünftig dargestellt bekomme?

Danke!

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Ungewöhnlicher abstand beim clearen von floats	adrianno	CSS	14	16.09.2009 14:20
Hintergrundbild und body	ChOpSueY!	CSS	1	27.05.2008 15:46
probleme mit float:left und listenhintergrund im IE6	Eppi	CSS	2	04.12.2006 13:10
(Newbie): Probleme mit Abständen - IE6 + Firefox	NullDevice	CSS	6	15.07.2006 20:22
Probleme beim rendering mit IE6	sileo	CSS	24	18.10.2005 22:00