CSS - "background-repeat:repeat-y"-Problem

[druluc]

Hallo, bin neu in der Erstellung von Web-Sites via CSS und bisher hat eigentlich alles ohne große Probleme gefuntzt. Habe jetzt leider das Problem, dass ich links einen Verlauf dargestellt habe und diesem gesagt habe er soll 100% der Seite vertikal (nach unten) einnehmen (der Verlauf ist in einer .jpg Datei, die als Hintergrund angegebn ist). Wenn man die ganze Sache "logisch" betrachtet macht er das auch! ICH will bzw. meine aber eigentlich, dass sich der Verlauf auf die volle Browsergröße ausbreitet. Problem ist jetzt nämlich, dass der Verlauf 100% dupliziert wird, ist der Inhalt aber länger sieht man den schönen Verlauf nicht mehr =( ... Anbei ein Screenshot von meinem Problem. Manchmal sagen Bilder mehr als tausend Worte!



Uploaded with ImageShack.us

Wie man sieht verhält sich der Browser normal, da er den Hintergrund bis 100% anzeigt und ab da nicht mehr (siehe Bild rechts unten 100%) ....

Hier noch mein CSS Code, der in einer externen CSS-Datei steht:

html, body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;

}

div#linker_verlauf_2 {
width:100%;
height:100%;
background-image: url(../bilder/linker_verlauf.jpg);
background-repeat:repeat-y;
border:0px solid #FF0000;
float:left;
}

Ich hoffe ihr könnt mir helfen =) Wenn irh mehr Infos braucht schreibt mir =)

 

[Mitglied 82689]

Du willst den Hintergrund vertikal dehnen auf die Länge der jeweiligen Seite passend zum dargestellten Inhalt?

Wer Pixel einer Grafik horizontal oder vertikal vermehren/interpolieren möchte braucht eine Bildbearbeitung. Ohne diese dehnt/vergrößert man Pixel und es wird pixelig.

 

[dahui]

html, body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
background: #fff url(../bilder/linker_verlauf.jpg) repeat-y top left;
 }

div#linker_verlauf_2 {
width:100%;
height:100%;
border:0px solid #FF0000;
float:left;
}

so?


ansonsten poste mal das html file und das css file als attachments.

 

[Mitglied 82689]

Wiederholung der Hintergrundgrafik auf der Y-Achse?
Mit float: left; und Deinen Anweisungen zum Background ist der erste Schritt getan. In einem div-Container macht es auch das was Du willst.

Schicke oder poste mir mal den kompletten HTML-Code.

 

[druluc]

Sehr cool! ALSO: Es würde gehen!!! GANZ so habe ich es mir aber nicht vorgestellt. Jetzt wird nämlich dieser verlauf von unten bis oben dargestellt! Will jedoch, dass der Verlauf erst ab einem bestimmten Punkt zu sehen ist. Wieder ein Bild:

Uploaded with ImageShack.us

Wenn ihr mir da auch noch ne lösung präsentieren könnt, wöre das super geil =)

Übrigens: ZACKIGE Hilfe hier =D <- Könnte mich auch mit der ersten Lösung anfreunden!

 

[Mitglied 82689]

Definiere einen div-Container für den Header/Kopfbereich mit der Hintergrundfarbe #ffffff und gib ihm die Höhe an Pixel die Du benötigst.