Hintergrundbild skalieren, Hintergrundbild skalieren Einstellungen

[Markus]

hallo,
ich habe mal wieder ein kleines Problem...

die Seite wird mit css gestaltet (der Tipp war anfangs etwas mühsam aber schon hilfreich was die Änderungen angeht)

oben befindet ein Container mit einer Hintergrundgrafik (ein JPG mit 8x8 Pixel) die in beide Richtungen wiederholt wird und mittig ein logo platziert wird.

links befindet sich ein Menü und rechts davon der Anzeigebereich der Seite und unten eine Fußzeile.

Die ganze Seite ist so angelegt, das ich nur Höhenangaben und Ränder gesetzt habe und den Rest eigentlich über Prozentangaben gelöst habe – der Hintergrund dieser Aktion ist das sich die Seite den verschiedenen Browsereinstellungen anpasst. Bis hierher klappt eigentlich alles (außer das sich Mozilla weigert einen Hintergrund anzuzeigen (egal ob Farbe oder Bild *grübel*)).

Jetzt wollte ich ein Hintergrundbild habe – etwas Schlichtes. Dabei handelt es sich um ein JPG das von links oben nach rechts unten von blau nach weiß verläuft.

Dieses Bild soll mit „Fixed“ und „no-repeat“ als Hintergrundbild verankert werden.

Das Problem das ich habe ist, dass das Bild nicht mit wachst bzw schrumpft wenn sich die Browsereinstellungen verändern. wenn man das Browserfenster verkleinert hat man irgendwann nur noch Blauverläufe und wenn man es stark vergrößert nur noch ein bild das halt im Hintergrund liegt *sieht aber nicht schön aus*

gibt es eine Möglichkeit dass das Hintergrundbild automatisch mit skaliert wird wie ich es auch bei den Containern machen kann, oder einen befehl für Farbverläufe?


Auszug der CSS datei:

QUELLTEXT

<style type="text/css">
<!--
body{
 background-color: #4F9EC9;
 background-image:url(../grafiken/bg-04.jpg);
 background-repeat:no-repeat;
 background-attachment:fixed;
 background-position : center;
 margin:0.5%;
 padding:0%;
 color: #4F9EC9;
 font-family: Arial, Verdana, Helvetica;
 }

 html{
 height:150%;
 margin:0.1%;
 padding:0.1%;
 color: #00007F
 }

.box1{
 min-height:100pt;
 background:#4F9EC9;
 background-image:url(../grafiken/bg_kopf4.jpg);
 background-repeat:repeat;
 margin:auto;
 padding:5pt;
 color: #00007F;
 }

.box2{
 background-image:url(../grafiken/bg_div.jpg);
 background-repeat:repeat;
 float:left;
 margin-top:1%;
 width:20%;
 min-height:100pt;
 padding:0.5%;
 }

.box3{
 background:transparent;
 float:right;
 width:75%;
 padding:5px;
 padding-left:5px;
 margin-top:1%;
 border:1px solid #0000DF;
 color: #00007F;
 font-family: Arial, Verdana, Helvetica;
 font-size: 100%;
 font-variant: normal;
 font-weight: 500;
 font-style: normal;
 line-height: normal;
 text-align: left;
 text-decoration: none;
 letter-spacing: normal;
 word-spacing: normal;
 }

.box4{
 clear:both;
 background:#4F9EC9;
 background-image:url(../grafiken/bg_div.jpg);
 background-repeat:repeat;
 color: #00007F;
 height:auto;
 margin:2%;
 padding:7pt;
 }
.
.
.

den Parameter "background-color:" habe ich nur angegeben, falls das Bild mal nicht geladen werden kann oder von Browser nicht angezeigt werden soll damit sich das gesamt Bild der Seite nicht zusehr verändert.


Markus

[Markus]

Hallo,

erst einmal vielen Dank an alle die helfen wollten.

@sqt
ja, so hatte ich mir das in etwa gedacht...
leider habe ich ich es nicht hin bekommen dies in die css datei einzubinden ;-(


das grösste Problem ist aber, dass mir die Grafik teilweise mit einem weißen Rand (nicht Rahmen) angezeigt wird (beim IE) und mit Opera normal... Mozilla zeigt eine wiesse seite an (ich hasse Mozilla - macht mir irgendwie immer ärger)

Abgesehen davon das der Rest der Seite unter dem geplantem BG angezeigt wird.

irgendwie muss ich mit das mit dem Z-index nochmal durchlesen...



Markus

uups... irgendwie hatte hier etwas nicht so geklappt wie geplant...

könnte bitte ein admin dieses post nach "HTML-Editor Phase5 Support > Sonstiges > HTML > Hintergrundbild skalieren" verschieben... danke

Der Beitrag wurde von Markus bearbeitet: 24.04.2005 - 16:52

[i.b.g]

Hallo,

... (ich hasse Mozilla - macht mir irgendwie immer ärger)  ....

Dann machst Du etwas falsch. Nur weil andere Browser eine höhere Fehlertoleranz haben, sind sie keinesfalls besser. Manchmal liegt es einfach an so lapidaren Dingen wie GROß/klein-Schreibung oder der richtigen Pfadbezeichnung.

.... uups... irgendwie hatte hier etwas nicht so geklappt wie geplant...

Das scheint Dich ein weing zu verfolgen .