✔ Hintergrund an DIV anpassen - Weiss jemand Rat?

[tobm_knows_best]

Hey zusammen,

bis jetzt habe ich noch immer versucht meine Hintergrundgrafiken (die teilw. doch ziemlich pixelgenau sind) anhand der Div-Größe anzupassen... Da ich aber teil. mit automatischen Höhen arbeite, würde mich interessieren, wie ich es anstelle, dass das DIV-Hintergrundbild immer brav mitskaliert - auch wenn sich die Höhe, bzw. die Breite dann mal ändert...

Kann mir diesbezüglich jemand helfen?

Denn dieser Mr. Google, von dem Sie alle reden, der spuckt nur alte Beiträge aus - und alles ziemlich verwirrend wenn Ihr mich fragt...

Vielen Dank für Eure Hilfe!

Gruß,
Tobm

 

[threadi]

Erst mit CSS3 wird es möglich sein Hintergrundbilder per CSS zu skalieren. Aktuell unterstützen das imho nur Firefox und Chrome. Eine andere Möglichkeit gibt es nicht. Nur die Alternative die "Hintergrundbilder" nicht als eben solche sondern als absolut positioniertes <img> innerhalb eines Eltern-Elements zu positionieren und mit 100% Breite und Höhe auszurichten.

 

[tobm_knows_best]

Erst mit CSS3 wird es möglich sein Hintergrundbilder per CSS zu skalieren. Aktuell unterstützen das imho nur Firefox und Chrome. Eine andere Möglichkeit gibt es nicht. Nur die Alternative die "Hintergrundbilder" nicht als eben solche sondern als absolut positioniertes <img> innerhalb eines Eltern-Elements zu positionieren und mit 100% Breite und Höhe auszurichten.

Verdammt... ok die HP ist optimiert für Firefox

Aaaaaaaaber - ist es denn dann auch möglich Text über ein solches DIV zu legen? ....? Oder muss ich ein 2. Div darübersetzen....

********

Merci für´s Feedback

Gruß,
Tobm

 

[threadi]

Eine Webseite sollte man nicht für irgendeinen Browser optimieren. Sie sollte in jedem (aktuellen) Browser laufen. Das ist auch gar nicht mal so schwer, wenn man sich an die Standards hält (selbst der IE macht da größtenteils mit).

Nein, du musst keine zusätzliche Hilfselemente einfügen. Was Du in diesem Element schreibst, ist dir überlassen.

 

[tobm_knows_best]

Eine Webseite sollte man nicht für irgendeinen Browser optimieren. Sie sollte in jedem (aktuellen) Browser laufen. Das ist auch gar nicht mal so schwer, wenn man sich an die Standards hält (selbst der IE macht da größtenteils mit).

Nein, du musst keine zusätzliche Hilfselemente einfügen. Was Du in diesem Element schreibst, ist dir überlassen.

Nun ja.. da gebe ich dir schon recht... soll lediglich aussagen dass ich die HP für einen gew. Browser mit entsprechender Bildschirmauflösung optimiert dargestellt haben möchte...

Aer wäre es möglich mir evtl. zu sagen wie ich das ganze dann anstellen kann? Ein kleine Code wäre ganz fein

MFG
Tobm

 

[tobm_knows_best]

Hab´s rausgefunden

einfach an die CSS des entsprechenden DIVs folgendes anhängen:

	-moz-background-size:100% 100%; /* Firefox */
	-webkit-background-size:100% 100%; /* Safari, Chrome */
	background-size:100% 100%; /* Opera, IE, W3C Standard */

Für diejenigen die noch ein wenig dazu wissen möchten - Auf dieser Seite hier ist das ganz gelungen beschrieben

Trotzdem nochmal vielen Dank

 

[threadi]

Erstaunlich wie weit die Browser schon sind. Beim IE bezweifel ich das jedoch. Hab leider gerade keinen um das mal zu testen.

 

[hela]

... Beim IE bezweifel ich das jedoch. Hab leider gerade keinen um das mal zu testen.

Hallo,

vermutlich funktioniert die Skalierung im IE9. Ich habe hier nur den IE8 unter Windows-XP, damit geht es jedenfalls nicht.

P.S.
Ich würde es eben deshalb auch mit einem IMG-Element realisieren. Ein paar Beispiele dazu hier: Perfect Full Page Background Image