Skaliertes "Hintergrundbild"

Lösung mit CSS 2.1 und absolut positionierten Ebenen

Mit CSS 2.1 ist es nicht möglich, ein Hintergrundbild, das mit background-image eingebunden wird, zu skalieren.

In CSS 3 ist vorgesehen, dass man die Grösse des Hintergrundbildes angeben kann. Aber das ist noch Zukunftsmusik...

Bis es soweit ist, kann man behelfsmässig herumbasteln mit zwei Ebenen, die mit position absolute bzw. fixed positioniert sind und übereinander liegen, wie es in diesem Beispiel der Fall ist.

Funktioniert "wie gewünscht" in Firefox 2.0 und 3.0.
(Das Bild füllt das Fenster in der Höhe und Breite komplett aus, wird also u.U. verzerrt, und bleibt stehen.)

Funktioniert "einigermassen" in:
MS IE 6.0. (Das Bild füllt das Fenster komplett aus; wenn man nach unten scrollt, bewegt sich das Bild nach oben, und unter dem Bild wird der Hintergrund weiss, da der MS IE 6.0 position:fixed nicht kann.)
Opera 9.26 (Das Bild füllt das Fenster komplett aus; wenn man ganz nach unten scrollt, erscheint ein horizontaler Scrollbalken.)

Siehe auch:

<= Zur Übersicht der Testseiten

Zur Homepage: tiptom.ch Thomas Lüthi, luthi@my-mail.ch - Zuletzt bearbeitet: 23.07.2008