zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Crossbrowser Farbverlauf Problem

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 10.05.2012, 11:15
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.05.2012
Beiträge: 5
Hazzi1 befindet sich auf einem aufstrebenden Ast
Standard Crossbrowser Farbverlauf Problem

Hallo zusammen,

wie der Titel schon sagt hab ich ein Problem mit einem Farbverlauf.
Der Farbverlauf bezieht sich auf den body tag der Seite und ist in vertikaler Richtung.

Das Problem das ich nun habe ist, dass eine Unterseite recht kurz ist. Soll heissen, dass das untere Ende der Seite ohne scrollen zu sehen ist. Hieraus ergibt sich das Problem, dass bei Firefox(12.0) und Chrome(18.0.1025.16 der Hintergrund(Farbverlauf) ab dem Ende der Seite wiederholt wird. Wie kann ich das umgehen? Ich müsste in diesem Fall ja vorher wissen, wie groß das Browserfenster ist um den Inhalt der Seite künstlich zu strecken. Ist das möglich?

Den Code den ich verwendet habe ist folgender

HTML-Code:
background: -webkit-gradient(linear, left top, left bottom, from(#EBEBEB), to(#FFFFFF));



background: -moz-linear-gradient(top, #EBEBEB, #FFFFFF);



filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#EBEBEB, endColorstr=#FFFFFF);



-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#EBEBEB, endColorstr=#FFFFFF)";
Vielen Dank für eure Bemühungen.
Viele Grüße
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 10.05.2012, 11:30
Benutzerbild von lottikarotti
Ein ♥ für's Web
XHTMLforum-Mitglied
 
Registriert seit: 18.04.2012
Ort: Karlsruhe
Beiträge: 396
lottikarotti wird schon bald berühmt werden
Standard

Hallo,

du könntest für das Element html eine minimale Höhe (mit der Eigenschaft min-height) von 100% festlegen. Wenn dein Farbverlauf nun auf das Element body angewendet wird, dürfte dieser sich über die gesamte Seite strecken, sofern der Inhalt vollständig im sichtbaren Bereich liegt. Wird die Seite länger, dehnen sich html und somit auch body nach unten hin aus.

Um dein Problem etwas deutlicher zu machen, postest du beim nächsten Mal bitte dein vollständiges CSS + HTML und, wenn möglich, einen Link zu deinem Problem.

Gruß, lotti.
__________________
Empfehlenswerte Links:
jsFiddle | JavaScript Patterns | RedBeanPHP | Mozilla Developer Network -/- W3C Validator | JSLint

Geändert von lottikarotti (10.05.2012 um 12:04 Uhr) Grund: Hinweis von fricca berücksichtigt. Danke!
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 10.05.2012, 11:39
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.05.2012
Beiträge: 5
Hazzi1 befindet sich auf einem aufstrebenden Ast
Standard

Hallo lotti,

ich habe es gerade ausprobiert und es funktioniert einwandfrei.
So einfach kann es manchmal gehen.

Vielen Dank für die schnelle Antwort und die Verlinkungen.

Viele Grüße
Hazzi
Mit Zitat antworten
  #4 (permalink)  
Alt 10.05.2012, 11:44
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.778
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Zitat:
Zitat von lottikarotti Beitrag anzeigen
du könntest für das Element html eine minimale Höhe (mit der Eigenschaft min-height) von 100% festlegen. Dem Element body gibst du dann eine Höhe (mit der Eigenschaft height) von 100%.
Die height-Angabe des body ist wirkungslos, weil der Bezugswert fehlt. Wenn html keine eigenen Angaben für einen Hintergrund hat ist für body auch nichts weiter nötig.
Mit Zitat antworten
  #5 (permalink)  
Alt 10.05.2012, 12:01
Benutzerbild von lottikarotti
Ein ♥ für's Web
XHTMLforum-Mitglied
 
Registriert seit: 18.04.2012
Ort: Karlsruhe
Beiträge: 396
lottikarotti wird schon bald berühmt werden
Standard

Zitat:
Zitat von fricca Beitrag anzeigen
Die height-Angabe des body ist wirkungslos, weil der Bezugswert fehlt. Wenn html keine eigenen Angaben für einen Hintergrund hat ist für body auch nichts weiter nötig.
Hallo,

das stimmt natürlich. Da habe ich mal wieder Unsinn verzapft. Danke für die Info!

Gruß, lotti.
__________________
Empfehlenswerte Links:
jsFiddle | JavaScript Patterns | RedBeanPHP | Mozilla Developer Network -/- W3C Validator | JSLint
Mit Zitat antworten
  #6 (permalink)  
Alt 10.05.2012, 12:43
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.05.2012
Beiträge: 5
Hazzi1 befindet sich auf einem aufstrebenden Ast
Standard

Und ich sage nochmals vielen Dank an fricca für die zusätzliche Info.

Viele Grüße
Hazzi
Mit Zitat antworten
Antwort

Stichwörter
chrome, cross browser, farbverläufe, gradient

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
Font der Überschrift ändern (Problem) artist CSS 2 07.12.2007 11:01
Design zu CSS/HTML verarbeiten - Problem häufen sich. Grafikamateur CSS 2 06.08.2007 10:57
Problem mit WordPress und dem Bilder Upload Maxefix Serveradministration und serverseitige Scripte 0 19.12.2006 15:58
Problem bei Div's - zwei mal das gleiche und doch nicht ... Niriel CSS 10 09.06.2005 18:39
Problem mit einem CSS Layout nARC CSS 20 21.05.2005 07:28


Alle Zeitangaben in WEZ +2. Es ist jetzt 01:55 Uhr.