Ergebnis 1 bis 6 von 6
  1. #1
    Uelzener Rambour
    Themenstarter

    Registriert
    10.2009
    Ort
    Seligenstadt
    Beiträge
    366

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

    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:
    Code:
    html, body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    
    }
    Code:
    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 =)
    Mit freundlichem Gruß
    Lucas

     iPhone 3G[S] 16 GB ||  MacBook Pro 13", 2010, 2,4 Ghz, 320M, 250 GB, 8 GB Ram || ♥ ACER S273HLbmii, 27" Monitor || ♥ XBOX 360 S

  2. #2
    Friedberger Bohnapfel Avatar von RaymondKL
    Registriert
    06.2009
    Alter
    35
    Beiträge
    531
    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.
    "Man wird schneller alt, als man Erfolg hat." (Raymond Kerrin Larum)

  3. #3
    Carmeliter-Renette
    Registriert
    10.2006
    Beiträge
    3.303
    Code:
    html, body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    background: #fff url(../bilder/linker_verlauf.jpg) repeat-y top left;
     }
    Code:
    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.

  4. #4
    Friedberger Bohnapfel Avatar von RaymondKL
    Registriert
    06.2009
    Alter
    35
    Beiträge
    531
    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.
    "Man wird schneller alt, als man Erfolg hat." (Raymond Kerrin Larum)

  5. #5
    Uelzener Rambour
    Themenstarter

    Registriert
    10.2009
    Ort
    Seligenstadt
    Beiträge
    366
    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!
    Mit freundlichem Gruß
    Lucas

     iPhone 3G[S] 16 GB ||  MacBook Pro 13", 2010, 2,4 Ghz, 320M, 250 GB, 8 GB Ram || ♥ ACER S273HLbmii, 27" Monitor || ♥ XBOX 360 S

  6. #6
    Friedberger Bohnapfel Avatar von RaymondKL
    Registriert
    06.2009
    Alter
    35
    Beiträge
    531
    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.
    "Man wird schneller alt, als man Erfolg hat." (Raymond Kerrin Larum)

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •