zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Farbverlauf als Background

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 30.09.2009, 15:34
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 25.07.2009
Ort: Wanne-Eickel
Beiträge: 223
TanjaP. befindet sich auf einem aufstrebenden Ast
Standard Farbverlauf als Background

Hi zusammen,

ich möchte einen Farbverlauf für den Hintergrund meiner Seiten haben.

Das Problem: der Farbverlauf soll im Viewport unten anfangen; aber entweder setze ich ihn (ungewollt) über den Footer oder aber er fängt zu spät an (bei kleinerer Bildschirmauflösung sieht man ihn gar nicht).
Habe schom probiert mit bottom, position (absolute und fix), repeat aber irgenwie bekomme ich es nicht hin. Egal ob ich das gannze für html oder body definiere. Helft ihr mir auf die Sprünge?

Hier der css-Teil
Code:
html {
background: #ffffcc;
background-image:  url('/hp/verlauf.gif');

height : 100%; 
}

body { 
/*background: #ffffcc;
background-image:  url('/hp/verlauf.gif');*/
font-family :  "Book Antiqua", Georgia, Arial, sans-serif; 
text-align : center; 
color : #008080; 
height : 100%; 
}
und hier ein link zur Seite (die eigentlich von gelb nach grün verlaufen sollte, sieht man aber erst bei höherer Auflösung, aber dort auch nicht richtig, fängt eben "zu spät" an)
Undercover-Coon's

Und ich weiß, ich bin eine "Design"-Krampe...

Tanja
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 30.09.2009, 15:54
Benutzerbild von Boris
Tanzender Webentwickler
XHTMLforum-Kenner
 
Registriert seit: 29.07.2004
Ort: Kornwestheim / Stuttgart
Beiträge: 4.930
Boris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer Mensch
Standard

Wie wärs mit background-position: bottom left; ?
__________________
My software never has bugs. It just develops random features ...

» DevShack - die Website des freien Webentwicklers Boris Bojic
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 30.09.2009, 19:56
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 25.07.2009
Ort: Wanne-Eickel
Beiträge: 223
TanjaP. befindet sich auf einem aufstrebenden Ast
Standard

Supi, das klappt einwandfrei. Muss das ganze nur im html lassen, im body geht´s nicht. Aber egal.
Schön, wenn man sich damit auskennt. Ich google manchmal stundenlang und komme auf keinen grünen Zweig und hier geht´s ruck zuck.

Vielen Dank
Tanja

Nachtrag: ich musste dem html noch ein overflow:hidden geben, sonst hätte ich eine doppelte Scroll-Leiste gehabt.

Geändert von TanjaP. (30.09.2009 um 20:04 Uhr) Grund: was zugefügt
Mit Zitat antworten
  #4 (permalink)  
Alt 30.09.2009, 22:23
Benutzerbild von Boris
Tanzender Webentwickler
XHTMLforum-Kenner
 
Registriert seit: 29.07.2004
Ort: Kornwestheim / Stuttgart
Beiträge: 4.930
Boris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer Mensch
Standard

Dafür sind wir doch da

Von deinem Codeschnipsel da oben dürfte es aber eigentlich nicht zwei Scrollbalken geben. Gib html und body noch ein padding: 0; margin: 0; mit - dann passt es ohne overflow: hidden
__________________
My software never has bugs. It just develops random features ...

» DevShack - die Website des freien Webentwicklers Boris Bojic
Mit Zitat antworten
  #5 (permalink)  
Alt 30.09.2009, 22:41
Benutzerbild von Pr0g
(^.^)
XHTMLforum-Mitglied
 
Registriert seit: 22.08.2005
Ort: Düsseldorf
Beiträge: 535
Pr0g wird schon bald berühmt werden
Standard

Warum geht es nicht im Body? Ist oben der aktuelle Code verlinkt, warum gibst du den zwei Haupt-Divs (so nenne ich sie mal) ein overflow:auto?
__________________
Mit Zitat antworten
  #6 (permalink)  
Alt 01.10.2009, 00:02
Benutzerbild von plastiko
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 26.12.2007
Ort: Hannover
Beiträge: 945
plastiko ist ein Lichtblickplastiko ist ein Lichtblickplastiko ist ein Lichtblickplastiko ist ein Lichtblickplastiko ist ein Lichtblick
Standard

Tanja,
entferne mal alle overflow: auto / hidden und position: absolute / fixed.

Dann gebe #contents min-height: 100% und #footer eine Höhe in em + negativen margin-top in em.


css-faq4 100% Höhe Footer Stick Alt
__________________
MfG
Jens

Geändert von plastiko (01.10.2009 um 00:15 Uhr)
Mit Zitat antworten
  #7 (permalink)  
Alt 01.10.2009, 06:44
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 25.07.2009
Ort: Wanne-Eickel
Beiträge: 223
TanjaP. befindet sich auf einem aufstrebenden Ast
Standard

ho ho ho - immer langsam mit der alten Dame hier ....

ich probier das später mal alles aus (muss gleich erst die Kiddis "fertig" machen und was erledigen).

Ich habe (eigentlich) einen festen, sehr schmalen Header (muss nur manchmal eine Textzeile rein), den mittleren content-Bereich mit dem eigentlichen Ihnhalt (scrollbar) und einen festen Footer, der bei zu kleinem Anzeigenfenster scrollbar sein soll. Ich habe versucht, das ganze als liquid zu machen. Ein Menu muss fixed sein, sonst ist man total weit unten auf der Seite (Bilder) und man muss wieder zurück, um an das Menu zu kommen (mich nervt sowas).
Ich hab tierisch lange dran gesessen, weil css für mich (nach Frontpage und 100% Tabellenlauyout) gar nicht so einfach war; wollte meine HP auch nicht komplett verwerfen sondern jetzt nach und nach umgestalten.

Probiere Eure Tipps mal durch und melde mich dann...

Tanja

Sodele,

der Vorschlag von Boris funktioniert.
Setze ich das ganze in den body, ist der Farbverlauf nicht mehr zu sehen.
Mein Footer muss immer sichtbar sein, weil dort ein Menu drin ist.
@ plastiko: setze ich die Vorschläge um, rutscht mein Footer an das Ende der Seite (und ist daher nicht mehr am Ende des Viewports), ist aber nur durch scrollen zu erreichen und der Farbverlauf beginnt erst über dem Footer (Beispielseite: Undercover-Coon's , egal ob body oder html (Seite sieht so bescheiden aus, ist aber auch nur test-Seite!)
Ich hatte viele "feste" Footer ausprobiert; den "Alt", den von Sejuma und noch ein paar andere. Nur mit dem von Stu habe ich es so hinbekommen (warum auch immer..)

Warum ist margin, padding besser als overflow?

Tanja

Geändert von TanjaP. (01.10.2009 um 09:55 Uhr) Grund: alles probiert
Mit Zitat antworten
  #8 (permalink)  
Alt 01.10.2009, 18:04
Benutzerbild von plastiko
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 26.12.2007
Ort: Hannover
Beiträge: 945
plastiko ist ein Lichtblickplastiko ist ein Lichtblickplastiko ist ein Lichtblickplastiko ist ein Lichtblickplastiko ist ein Lichtblick
Standard

Du mußt body und html height: 100% geben.
Die floats in #footer müssen eingeschlossen werden (hast du vorher mit overflow gemacht).
#footer ist höher als 2em;

Am einfachsten kopierst Du den Quelltext (ohne externes css) von
themaninblue.com/experiment/footerStickAlt/good_example_short.htm
und fügst nach und nach Deine Inhalte ein.
__________________
MfG
Jens

Geändert von plastiko (01.10.2009 um 18:07 Uhr)
Mit Zitat antworten
  #9 (permalink)  
Alt 01.10.2009, 20:06
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 25.07.2009
Ort: Wanne-Eickel
Beiträge: 223
TanjaP. befindet sich auf einem aufstrebenden Ast
Standard

Das bekomm ich nicht hin, verstrubbelt mir irgendwie alles ...
Momentan möchte ich nur über css ändern; in naher Zukunft werde ich die Seiten sicherlich nochmals überarbeiten, aber momentan fehlt mir eine Idee zur Umsetzung und eines nicht völlig anderen Layouts.
Ich bin schon an einem drop-down Menü gescheitert, weil es immer wieder zu war nach einem neuen Seitenaufruf.

Man lernt nie aus, aber ich tue mich etwas schwer damit ...

Tanja
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Inline Listenelement wird nicht richtig im background befüllt SteveB CSS 3 28.04.2011 20:41
Problem mit CSS Style flo007 CSS 3 25.01.2009 17:08
Float-Reihenfolge? wolf1985 CSS 0 21.08.2008 01:35
Footer left und right Probleme... wolf1985 CSS 2 14.08.2008 13:04
Mozilla zeigt DIV zu oft an cracki CSS 6 09.03.2008 15:22


Alle Zeitangaben in WEZ +2. Es ist jetzt 10:50 Uhr.