Top-Themen

AppleEntwicklungHardwareInternetLinuxMicrosoftMultimediaNetzwerkeOff TopicSicherheitSonstige SystemeVirtualisierungWeiterbildungZusammenarbeit

Aktuelle Themen

Administrator.de FeedbackApache ServerAppleAssemblerAudioAusbildungAuslandBackupBasicBatch & ShellBenchmarksBibliotheken & ToolkitsBlogsCloud-DiensteClusterCMSCPU, RAM, MainboardsCSSC und C++DatenbankenDatenschutzDebianDigitiales FernsehenDNSDrucker und ScannerDSL, VDSLE-BooksE-BusinessE-MailEntwicklungErkennung und -AbwehrExchange ServerFestplatten, SSD, RaidFirewallFlatratesGoogle AndroidGrafikGrafikkarten & MonitoreGroupwareHardwareHosting & HousingHTMLHumor (lol)Hyper-VIconsIDE & EditorenInformationsdiensteInstallationInstant MessagingInternetInternet DomäneniOSISDN & AnaloganschlüsseiTunesJavaJavaScriptKiXtartKVMLAN, WAN, WirelessLinuxLinux DesktopLinux NetzwerkLinux ToolsLinux UserverwaltungLizenzierungMac OS XMicrosoftMicrosoft OfficeMikroTik RouterOSMonitoringMultimediaMultimedia & ZubehörNetzwerkeNetzwerkgrundlagenNetzwerkmanagementNetzwerkprotokolleNotebook & ZubehörNovell NetwareOff TopicOpenOffice, LibreOfficeOutlook & MailPapierkorbPascal und DelphiPeripheriegerätePerlPHPPythonRechtliche FragenRedHat, CentOS, FedoraRouter & RoutingSambaSAN, NAS, DASSchriftartenSchulung & TrainingSEOServerServer-HardwareSicherheitSicherheits-ToolsSicherheitsgrundlagenSolarisSonstige SystemeSoziale NetzwerkeSpeicherkartenStudentenjobs & PraktikumSuche ProjektpartnerSuseSwitche und HubsTipps & TricksTK-Netze & GeräteUbuntuUMTS, EDGE & GPRSUtilitiesVB for ApplicationsVerschlüsselung & ZertifikateVideo & StreamingViren und TrojanerVirtualisierungVisual StudioVmwareVoice over IPWebbrowserWebentwicklungWeiterbildungWindows 7Windows 8Windows 10Windows InstallationWindows MobileWindows NetzwerkWindows ServerWindows SystemdateienWindows ToolsWindows UpdateWindows UserverwaltungWindows VistaWindows XPXenserverXMLZusammenarbeit
GELÖST

Webseite erstellen, CSS Problem mit Mozilla

Frage Entwicklung Webentwicklung

Mitglied: AsciWhite

AsciWhite (Level 1) - Jetzt verbinden

22.11.2012, aktualisiert 12:15 Uhr, 2997 Aufrufe, 21 Kommentare

Hallo an alle,
Ich erstelle zur Zeit eine Webseite in der ein Farbverlauf liegen soll. Bisher bin ich bei diesem Stand:
01.
... 
02.
<body style="background: -moz-linear-gradient(60% 0% 315deg,#FF2D2D, #2D2DFF, #000000 100%);"> 
03.
...
Leider erzeugt Mozilla damit aber nur eine sich wiederholende Zeile des Farbverlaufs. Also habe ich eine Höhenangabe hinzugefügt:
01.
... 
02.
<body style="background: -moz-linear-gradient(60% 0% 315deg,#FF2D2D, #2D2DFF, #000000 100%); height: 2000px"> 
03.
...
Damit wird zwar der Farbverlauf auf die Größe gesetzt, aber ich habe bei unterschiedlichen Auflösungen die unbeliebten Scrollbalken.
Ein Code nach diesem Schema wird jedoch vom FF komplett ignoriert.
01.
... 
02.
<body style="background: -moz-linear-gradient(60% 0% 315deg,#FF2D2D, #2D2DFF, #000000 100%); height: 100%"> 
03.
...
Frage: wie bekomme ich FF dazu überredet, den Farbverlauf auf die gesamte Seitenhöhe anzuwenden?

Mit freundlichen Grüßen
Mitglied: B4ZTI4N
22.11.2012 um 12:39 Uhr
01.
> ... 
02.
> <body style="background: -moz-linear-gradient(60% 0% 315deg,#FF2D2D, #2D2DFF, #000000 100%);"> 
03.
> ... 
04.
> 

Du kannst

style="background: -moz-linear-gradient(60% 0% 315deg,#FF2D2D, #2D2DFF, #000000 100%); background-repeat:repeat-x;"

Vielleicht kann man dann gesondert nochmal die Farbe vom Verlaufsende unten nehmen dann wiederholt er sich zumindest nur horizontal.
Bitte warten ..
Mitglied: AsciWhite
22.11.2012, aktualisiert um 13:07 Uhr
Hallo und erstmal Danke für deinen Versuch.

nach kleiner Korrektur am Ende deiner Zeile (erst " dann ; oder?) habt ich nun folgendes probiert:
01.
<body style="background: -moz-linear-gradient(60% 0% 315deg,#FF2D2D, #2D2DFF, #000000 100%); background-repeat:repeat-x";> 
Leider ohne Erfolg. FF macht stur eine schmale Zeile...
Screenshots hochladen ist ja hier anscheinend nicht mehr, also: http://s1.directupload.net/file/d/3082/yq77emhm_jpg.htm
Bitte warten ..
Mitglied: B4ZTI4N
22.11.2012 um 13:27 Uhr
Danke!!! verschrieben

Vielleicht erstmal ein 1px breites jpg mit passender größe nehmen und repeat-x drauf anwenden. Backgroundcolor = endfarbe.

Und jetzt überlegen wir uns nochmal was...
Bitte warten ..
Mitglied: AsciWhite
22.11.2012 um 13:42 Uhr
ne ne ne neee... die "Bildchen-Methode" will ich ja gerade nicht nutzen weil das ja die nur das Problem umgeht und ich will ja auch valides (x)html schreiben ;)

Außerdem funktioniert -moz-linear-gradient ja bei div-Tags zb. Was mich auch noch brennend interessieren würde wär ja, wieso der angegebene Winkel einfach mal ignoriert wird, wenn ich das im body-Tag machen will :-O Beim div geht das ganze nämlich 1a :-O (soviel dazu, dass nur der IE sich nicht an Konventionen hällt)

Gruß
Bitte warten ..
Mitglied: Bosnigel
22.11.2012 um 13:57 Uhr
Muss da nicht ein repeat-y hin?
Bitte warten ..
Mitglied: AsciWhite
22.11.2012 um 13:58 Uhr
Soweit ich den Befehl verstanden hab muss da gar nichts hin. Ich will ja gar nicht, dass irgendwas in irgendeiner Richtung wiederholt wird :-O

Gruß
Bitte warten ..
Mitglied: 16568
22.11.2012 um 14:18 Uhr
Ich gebe Dir den Tipp:

lerne erst mal richtig, CSS in HTML zu verwenden.
Styles werden erstens ausgelagert, und zweitens ist der Gradient lediglich beim FF zu sehen.
(und drittens: Du bist auch einer der Vielen hier, die nicht mal die Mindestanforderungen an eine Frage fertigbekommen...)


Lonesome Walker
(ein Profi in [X]HTML [4/5], CSS und JavaScript)
Bitte warten ..
Mitglied: AsciWhite
22.11.2012, aktualisiert um 14:47 Uhr
Ohhh, Meister ergötze mich und alle anderen Unwissenden ...

Ich habe nie behauptet, dass ich alles kann. Deshalb stelle ich auch hier meine Fragen rein!
Mir ist NATÜRLICH klar, dass CSS in eine eigene Datei gehört, aber der Problemstellung hier ist das völlig Schnuppe.
So nebenbei glaube ich schon das es für den IE was gib... zb: "background: -ms-linear-gradient"
Das führt aber ja von meinem Problem weg.

Du als "ein Profi in [X]HTML [4/5], CSS und JavaScript" solltest mir doch sicher meine Frage beantworten können, stimmst?

PS: für dich kommentiere ich Sarkasmus zukünftig mit "Bazinga" :D
PPS: Was meine Fragestellung angeht finde ich schon, das man und ander diese sehr wohl verstehen können ...
Bitte warten ..
Mitglied: 16568
22.11.2012 um 16:56 Uhr
Zitat von AsciWhite:
PPS: Was meine Fragestellung angeht finde ich schon, das man und ander diese sehr wohl verstehen können ...

na, dann gucken wir doch mal, ob Du sie hier gelöst kriegst...


Lonesome Walker
Bitte warten ..
Mitglied: AsciWhite
22.11.2012 um 17:05 Uhr
du scheinst jedenfalls nichts brauchbares beisteuern zu können, Mister XML/CSS/XHTML Profi ...
Bitte warten ..
Mitglied: Arano
22.11.2012, aktualisiert um 18:44 Uhr
Hallo zusammen

Also lösen muss er das schon selber...
Asci, mit dem folgendem HTML sollte sollst du die folgenden Fragen beantworten können:
01.
<html> 
02.
  <head> 
03.
    <title>-moz-linear-gradient( ...testing... )</title> 
04.
    <style tyoe="text/css"> 
05.
      <!-- 
06.
        html { border: 10px solid #ff0000; } 
07.
        body { border: 10px solid #00ff00; } 
08.
        p    { border: 10px solid #0000ff; } 
09.
      --> 
10.
    </style> 
11.
  </head> 
12.
  <body> 
13.
   
14.
   
15.
  <p># 
16.
    Hier ist ein Absatz, dieser sollte schon etwas l&auml;nger sein denn nur eine Zeile w&auml;re dann doch etwas wenig... 
17.
    Hier ist ein Absatz, dieser sollte schon etwas l&auml;nger sein denn nur eine Zeile w&auml;re dann doch etwas wenig... 
18.
    Hier ist ein Absatz, dieser sollte schon etwas l&auml;nger sein denn nur eine Zeile w&auml;re dann doch etwas wenig...<br> 
19.
    Hier ist ein Absatz, dieser sollte schon etwas l&auml;nger sein denn nur eine Zeile w&auml;re dann doch etwas wenig... 
20.
  #</p> 
21.
   
22.
   
23.
  </body> 
24.
</html>
  1. Wie hoch ist __die Seite__ ?
  2. Wieso erzeugt hier ein CSS: body{ height:100% } Scrollbalken ? (auch wenn alle "border = 0px" sind)
  3. Welchem Element sollte der Farbverlauf zugeordnet werden ? Und...
  4. Welche Eigenschaften sollte dieses haben ?


Und nun sollte auch diese Bemerkung, tatsächlich einen Sinn ergeben:
(...lerne erst mal richtig, CSS in HTML zu verwenden. ...)



~Arano

PS: Naja... zumindest hoffe ich das man das kann... *fg*
Es gibt "keine" dummen Fragen, dumm ist es nur __nicht__ zu fragen
Bitte warten ..
Mitglied: Bosnigel
22.11.2012, aktualisiert um 19:49 Uhr
Also mit
01.
 <body style="background: -moz-linear-gradient(60% 0% 315deg,#FF2D2D, #2D2DFF, #000000 100%); background-repeat:repeat-x";> 
Macht er mir den gesamten Hintergrund mit Farbverlauf und ohne Scrollbalken.
Ist das nicht das gewünschte Ergebnis?
Bitte warten ..
Mitglied: AsciWhite
23.11.2012 um 08:21 Uhr
hallo Bosnigel,
ja, das ist das gewünschte Verhalten, aber bei mir wird der Winkel von 315deg für den Farbverlauf (von links oben nach rechts unten) ignoriert. Es wird nur ein waagerechter erstellt. Wenn ich die gleiche Zeile auf ein div anwende klappts.

Gruß
Bitte warten ..
Mitglied: AsciWhite
26.11.2012 um 10:45 Uhr
Hallo,
nach etwas probieren habe ich nun selber folgende Lösung gefunden:

01.
... 
02.
<body> 
03.
  <div> 
04.
    ... 
05.
  </div> 
06.
</body> 
07.
...
In der HTML Datei steht also keine Stylesheet-Angabe mehr und die CSS Datei hat diesen Aufbau:

01.
html { 
02.
  height: 100%; 
03.
04.
 
05.
body{ 
06.
  height: 100%; 
07.
  margin: 0px; 
08.
  background: -moz-linear-gradient(60% 0% 315deg,#FF2D2D, #2D2DFF, #000000 100%); 
09.
}
Somit wird der gesamte Seitenhindergrund mit dem Farbverlauf von links oben nach rechts unten gefüllt. Solage der Inhalt es nicht verlangt kommen auch keine Scollbalken.

Gruß und Danke an die, die sich wenigstens mit Vorschägen beteiligt haben...
Bitte warten ..
Mitglied: 16568
26.11.2012 um 12:23 Uhr
Siehste, geht doch...

Immer diese Uneinsichtigen


Lonesome Walker
Bitte warten ..
Mitglied: AsciWhite
26.11.2012 um 13:30 Uhr
komisch nur, dass von dir nichts brauchbares kam ...
Bitte warten ..
Mitglied: Arano
26.11.2012 um 13:52 Uhr
komisch nur, dass von dir nichts brauchbares kam ...
Das kann ich dir in gewisser Hinsicht eigentlich auch vorwerfen !
Denn warte ich noch immer auf mindestens eine Antwort zu meinen Fragen mit denen ich DIR helfen wollte... von vor VIER TAGEN !

Aber statt dessen Quittierst du das mit einem
habe ich nun selber ... gefunden

Schönen Dank auch,
schönen Tag noch,
auf nimmer Wiedersehen


~Arano
Bitte warten ..
Mitglied: 16568
26.11.2012, aktualisiert um 14:08 Uhr
Zitat von AsciWhite:
komisch nur, dass von dir nichts brauchbares kam ...

Echt?
Ja, schade daß Du nicht lesen kannst:

Zitat von 16568:
Ich gebe Dir den Tipp:

lerne erst mal richtig, CSS in HTML zu verwenden.
Styles werden erstens ausgelagert, und zweitens ist der Gradient lediglich beim FF zu sehen.
(und drittens: Du bist auch einer der Vielen hier, die nicht mal die Mindestanforderungen an eine Frage fertigbekommen...)

So, wer hatte Recht?

@Arano:
Schönen Dank auch,
schönen Tag noch,
auf nimmer Wiedersehen

Nimm es nicht schwer, alleine die Formulierung seiner Frage hat ihn sicherlich geistig schon sehr gefordert


Lonesome Walker
Bitte warten ..
Mitglied: AsciWhite
26.11.2012 um 14:06 Uhr
Das war auch nicht an dich gerichtet ~Arno sondern an die unqualifizierten Kommentare von Herrn xHTML Profi L.Walker ...

Sorry, dass ich nicht explizit geschrieben habe, dass dein Vorschlag leider nicht auf mein Problem zutraf ...

Gruß
Bitte warten ..
Mitglied: Arano
26.11.2012 um 15:11 Uhr
Zitat von AsciWhite:
Das war auch nicht an dich gerichtet ~Arno sondern an die unqualifizierten Kommentare von Herrn xHTML Profi L.Walker ...
Ja das habe ich auch so aufgefasst und verstanden !

Sorry, dass ich nicht explizit geschrieben habe, dass dein Vorschlag leider nicht auf mein Problem zutraf ...
Nun ja, das meine Vorschläge hin und wieder tatsächlich mal nicht zutreffen kenne ich schon, das ist kein Problem.
Aber wenn ich mir meine Fragen so ansehen, mit denen ich auf die HÖHE zweier Elemente eingehe und das mit deiner Lösung vergleiche (in der ausgerechnet die HÖHE zweier Elemente definiert wird) dann... ach was soll's...

...die Frage ist ja als gelöst markiert und das Problem ist es !


Schöne Woche noch
~Arano
Bitte warten ..
Mitglied: AsciWhite
26.11.2012 um 15:31 Uhr
Das da Scrollbalken kommen liegt an den borders (und ggf. margin und padding). Darüber bin ich auch schon gestolpert.

Den Farbverlauf habe ich dem Body-Tag über die CSS-Datei mitgegeben und die "Höhe zweier Elemente" muss wohl sein, da das body ja im html Tag verschachtelt ist.

Mit freundlichen Grüßen
Bitte warten ..
Neuester Wissensbeitrag
Humor (lol)

Linkliste für Adventskalender

(3)

Information von nikoatit zum Thema Humor (lol) ...

Ähnliche Inhalte
Microsoft Office
Access Problem beim Bericht erstellen (1)

Frage von terpeberi zum Thema Microsoft Office ...

Multimedia & Zubehör
BENQ Beamer Fernbedingung Frequenz Problem (2)

Frage von xbast1x zum Thema Multimedia & Zubehör ...

RedHat, CentOS, Fedora
gelöst Erstellen von Desktopverknüpfungen und Anpassung der Taskleiste (2)

Frage von honeybee zum Thema RedHat, CentOS, Fedora ...

Heiß diskutierte Inhalte
Windows Server
DHCP Server switchen (25)

Frage von M.Marz zum Thema Windows Server ...

SAN, NAS, DAS
gelöst HP-Proliant Microserver Betriebssystem (14)

Frage von Yannosch zum Thema SAN, NAS, DAS ...

Grafikkarten & Monitore
Win 10 Grafikkarte Crash von Software? (13)

Frage von Marabunta zum Thema Grafikkarten & Monitore ...

Windows 7
Verteillösung für IT-Raum benötigt (12)

Frage von TheM-Man zum Thema Windows 7 ...