Background-height: 100%

[Alexander 5675]

Meine Seite ist in einem Div Container enthalten, der eine fixe Breite hat und sich in der Mitte der Seite befindet.
Ich möchte jetzt dem Body Element ein Hintergrundbild zuweisen, und zwar habe ich dafür einen Farbverlauf erstellt. Das Bild ist 10 Pixel breit und 150 Pixel hoch. Jetzt möchte ich, dass dieses Hintergrundbild aber von ganz oben bis ganz unten vergrößert wird, je nachdem, wie groß das Fenster ist.
Also so zu sagen:
body {
background-image: ...;
background-repeat: repeat-x; /* das Bild wird seitlich wiederholt */
background-height: 100%;
}

Ich habe solche Lösungen aber nur für CSS 3 gefunden, und das wird im Moment ja noch kaum unterstützt. Und wenn ich das Bild als normales Bild in den Hintergrund stelle, dann kann ich es ja nicht seitlich wiederholen lassen...

Wie kann ich das sonst noch umsetzen?

[Cheatah]

Hi,

Jetzt möchte ich, dass dieses Hintergrundbild aber von ganz oben bis ganz unten vergrößert wird, je nachdem, wie groß das Fenster ist.

gegenwärtig ist es nicht möglich, Hintergrundgrafiken zu skalieren.

Wie kann ich das sonst noch umsetzen?

Nur auf widerwärtige Arten, die das Fehlmarkieren der Verzierung als Inhalt involvieren, indem <img>-Elemente verwendet werden.

Cheatah

[Gunnar Bittersmann]

@@Cheatah:

nuqneH

gegenwärtig ist es nicht möglich, Hintergrundgrafiken zu skalieren.

Deine Gegenwart liegt wohl zeitlich ein gutes Stück vor meiner.

Oder du bist – zusammen mit dem IE – in der Vergangenheit steckengeblieben.

Qapla'

[Cheatah]

Hi,

Deine Gegenwart liegt wohl zeitlich ein gutes Stück vor meiner.
Oder du bist – zusammen mit dem IE – in der Vergangenheit steckengeblieben.

wenn Du Firefox 3.5 als Teil der Gegenwart leugnest, kann ich da nichts für. Meine Gegenwart liegt jedenfalls in der Realität, nicht in der Utopie.

Cheatah

[Jeremy B.]

Hallo!

Das Bild ist 10 Pixel breit und 150 Pixel hoch.

1 Pixel hätte im Normalfall gereicht.

Ich habe solche Lösungen aber nur für CSS 3 gefunden, und das wird im Moment ja noch kaum unterstützt. Und wenn ich das Bild als normales Bild in den Hintergrund stelle, dann kann ich es ja nicht seitlich wiederholen lassen...

Das dürfte daran liegen, dass dies erst in CSS3 implementiert wird.

Du könntest allerdings das Bild in ein Div unter den eigentlichen Inhalt legen und strecken. Dürfte aber be..scheiden aussehen.

[Beat]

1 Pixel hätte im Normalfall gereicht.

Ich kann mich an Hardwareleistung erinnern, die 1px repeat als Animation darstellt.

mfg Beat

[Cheatah]

Hi,

Ich kann mich an Hardwareleistung erinnern, die 1px repeat als Animation darstellt.

ich auch. Ach, das waren noch Zeiten, als man jeden Morgen den Computer mit einer Kurbel startete!

Cheatah

[morgenstund]

Du könntest allerdings das Bild in ein Div unter den eigentlichen Inhalt legen und strecken. Dürfte aber be..scheiden aussehen.

Ja und? Als Hintergrundbild würde es genauso aussehen.

Sinnvoll ist es, dem Hintergrund die Farbe der unteren Pixel zu geben und das Bild nur horizontal zu strecken. Dann gibt es einen Farbverlauf so hoch das Bild ist und der Rest ist einfarbig.

MfG morgenstund

[Alexander 5675]

Danke für diese Idee, so werde ich es ws machen!

[Gunnar Bittersmann]

@@Jeremy B.:

nuqneH

Das Bild ist 10 Pixel breit und 150 Pixel hoch.

1 Pixel hätte im Normalfall gereicht.

Nein. Eine 1 Pixel breite Grafik müsste tausendfach wiederholt werden, eine 10 Pixel breite nur hundertfach.

Es gilt, einen guten Kompromiss zu finden.

Qapla'

[Gunnar Bittersmann]

@@Alexander 5675:

nuqneH

Ich möchte jetzt dem Body Element ein Hintergrundbild zuweisen, und zwar habe ich dafür einen Farbverlauf erstellt.

Für einen Farbverlauf brauchst du für die allermeisten Browser keine Grafik. Mozillas und Webkits kennen Gradienten, IE seinen proprietären Filter.

Qapla'