Neuigkeiten:

moziloCMS verwendet Cookies. Wenn Sie auf unserer Seite weitersurfen, stimmen Sie der Cookie-Nutzung zu Datenschutzerklärung
moziloCMS Layouts
moziloCMS Plugins

Hauptmenü

Mozilo 2.0: Schatten am Header

Begonnen von Toni-S, 03. November 2016, 14:55:52

« vorheriges - nächstes »

Toni-S

Hallo Zusammen,
beim Versuch, einen Schatten am Header anzubringen, versage ich kläglich  ???. Dabei bräuchte ich doch nur die Schatten vom content oder der sidebar übernehmen, oder? Oder von meiner anderen, sehr ähnlichen Seite. Da ist der Schatten dran. Aber  hier kommt nichts. Wieso? Wer mir das Geheimnis verrät, kriegt eine Tafel Schokolade :P !
Ich freue mich auf gute Nachrichten vom CSS-Geheimdienst aus dem Forum :) !

Das habe ich in der css/ style.css getan:

#banner { 
  height: 200px;
  padding-top: 20px;
  margin-bottom:30px; ;
  background-image: url(../grafiken/banner.jpg);
  background-repeat: no-repeat;
  text-align:left;
  border:0px solid #FFFFFF;   
  box-shadow: 5px 10px 10px #666666,

Toni

wasp

#1
Hallo!

... auf jeden Fall das Komma am Zeilenende durch ein Semikolon ersetzen.  :idea:

box-shadow: 5px 10px 10px #666666,


und ich gehe davon aus, das #banner - div mittels  }  auch korrekt geschlossen
wurde ...  :?: :!:


marusti

Zitat von: Toni-S am 03. November 2016, 14:55:52
  box-shadow: 5px 10px 10px #666666,


In welchem Browser schaust du es an? Alternativ mal noch

-webkit-box-shadow: 5px 10px 10px #666666;
-moz-box-shadow: 5px 10px 10px #666666;

zusätzlich einfügen. (und den Hinweis von wasp bezüglich } beachten)

hausl78

https://jigsaw.w3.org/css-validator/ mal drüber laufen lassen, kann auch nicht schaden. Bevor man da lange Fehler sucht sollte man zuerst mal prüfen ob das CSS valide ist.

Toni-S

Das mit der Schokolade wird leider nix, denn jetzt habe ich den Schatten selber drangekriegt. Ich loggte mich aus und später wieder ein, dann gab ich die Schatten-Parameter wie schon vorher ein und - prompt war der Schatten da. War wohl irgend ein Fehler in den unendlichen Weiten des Internets. Die Schokolade gönne ich mir jetzt selber.
Toni

Toni-S

Oh je, ich habe nicht bemerkt, dass ich 4 Antworten erhalten habe. Bereits in der ersten, nämlich von Stefan, stand das mit dem Komma. Das habe ich beim Neuversuch auch bemerkt. Trotzdem: Stefan kriegt die Schokolade!
Aber du müsstest mir sagen, Stefan, wohin ich sie legen (schicken) soll  :-X
Toni

wasp

#6
ReHi Toni!
Da Du den Fehler selbst gefunden hast, ist es nur korrekt Dir die Schokolade zu gönnen. Wichtig ist, dass es nun -wie gewünscht- funktioniert.  :)

ABER: Entferne doch aber besser die zweite, geschwungene (schliessende) Klammer -
Diese ist an der Stelle und in dem Fall unnötig bzw. sogar falsch, weil ja die Anweisungen für die einmalige ID "banner" (=deshalb das #) bereits durch die vorausgehende geschwungene (schliessende) Klammer geschlossen wurde...  :idea:

Ich habe auch keine Ahnung, wie die dort hinkam ...  ;)

djr

@Toni-S:

valider Code ist wichtig, da Du sonnst auf die Kulanz der Browser hoffen musst.

margin-bottom:30px; ;
... da ist noch ein ; zu viel.

Beachte am Besten den Tipp von @hausl78:
Zitat von: hausl78 am 04. November 2016, 11:51:20
https://jigsaw.w3.org/css-validator/ mal drüber laufen lassen, kann auch nicht schaden. Bevor man da lange Fehler sucht sollte man zuerst mal prüfen ob das CSS valide ist.

Toni-S

Hallo wasp, marusti, Hausl78 und djr,
ich bin überrascht über eure Anteilnahme an meinem Code, den ich in Wirklichkeit ja überhaupt nicht verstehe. Und ich bedanke mich sehr bei euch allen. Ich bin leider ziemlich unbedarft in Sachen Programmierung und offenbar auch noch recht schludderig, weil ich übersah, dass mir Antworten per Mail mitgeteilt werden. Dies ist der Grund, warum ich erst jetzt reagiere.
Aber schön langsam und mit eurer Hilfe lerne auch ich dazu.

An wasp: Dass ein Semikolon statt eines Kommas hin muss, entdeckte ich - welch Wunder - gestern ganz alleine. Und selbstverständlich befindet sich ein bisschen weiter unten die abschließende "}".
Die von dir entdeckte, doppelte }} und das doppelte Semikolon finde ich nicht mehr. Wahrscheinlich habe ich sie entfernt, als ich vor ein paar Tagen aus Verzweiflung die "style.css" komplett überschrieb. Aber du hast mich gelehrt, auf solche "Kleinigkeiten" besser zu achten. Kommt auch niiiiiiiie mehr vor! Höchstens aus Versehen.

An marusti: Nachdem es mir gelungen ist, einen brauchbaren Schatten hinzukriegen, bin ich mir jetzt nicht sicher, ob du irgendwelche Fehler in meinem Schatten siehst und mir deshalb einen Alternativschatten anbotest (vielen Dank jedenfalls dafür!) oder ob sich deine Antwort mit meiner Eigenlösung überschnitten hat. Ich verstehe allerdings nicht so richtig, was du mir mit "webkit-box-shadow" und "moz-box-shadow" sagen wolltest. Ich verwende übrigens Firefox.

An Hausl78: Zwar habe ich die Seite https://jigsaw.w3.org/css-validator/ schon mal gesehen, habe mich aber nie damit beschäftigt, weil ich nicht mal wusste, was ich damit anfangen könnte. Das hat sich seit heute - dank deiner Antwort - geändert. Und ich kann mit Stolz verkünden, dass der css-validator offenbar keinen echten Fehler auf meiner Seite gefunden hat. Allerdings meckert er mich wegen des Begriffs "box" an, der aber im mozilo-css steckt und offensichtlich problemlos funktioniert. Ich hab mir gleich ein Lesezeichen von deinem Link angelegt! Ich bedanke mich ausdrücklich bei dir!

Herzlichen Dank euch allen!
Toni

marusti

Zitat von: Toni-S am 09. November 2016, 21:46:12

An marusti: Nachdem es mir gelungen ist, einen brauchbaren Schatten hinzukriegen, bin ich mir jetzt nicht sicher, ob du irgendwelche Fehler in meinem Schatten siehst und mir deshalb einen Alternativschatten anbotest (vielen Dank jedenfalls dafür!) oder ob sich deine Antwort mit meiner Eigenlösung überschnitten hat. Ich verstehe allerdings nicht so richtig, was du mir mit "webkit-box-shadow" und "moz-box-shadow" sagen wolltest. Ich verwende übrigens Firefox.

Leider habe ich keine URL gesehen (oder überlesen), daher konnte ich es auch nicht nachschauen.
box-shadow ist schon die Standard CSS Anweisung, allerdings verstehen das nicht alle Browser und es kann sein, das es nicht angezeigt wird. Die anderen beiden Anweisungen machen genau das gleich, nur eben für andere Browsertypen.

Toni-S

Zitat von: djr am 08. November 2016, 21:30:43
@Toni-S:
djr schrieb mir:
valider Code ist wichtig, da Du sonnst auf die Kulanz der Browser hoffen musst.

margin-bottom:30px; ;
... da ist noch ein ; zu viel.

Beachte am Besten den Tipp von @hausl78:
Zitat von: hausl78 am 04. November 2016, 11:51:20
https://jigsaw.w3.org/css-validator/ mal drüber laufen lassen, kann auch nicht schaden. Bevor man da lange Fehler sucht sollte man zuerst mal prüfen ob das CSS valide ist.

Sorry djr, ich hatte deinen Beitrag gelesen, ihn kommentiert und mich bedankt, bemerke aber erst jetzt, dass ich ein paar Leute durcheinanderbrachte. Also: Die Semikolons sind - zumindest denke ich das - nun überall CSS valide. Und der Tipp mit dem w3-css-validator ist sowieso genial!
Herzlichen Dank für deine Hilfe,
Toni

djr

Zitat von: Toni-S am 10. November 2016, 14:14:02
Sorry djr, ... bemerke aber erst jetzt, dass ich ein paar Leute durcheinanderbrachte.
Kein Problem ;)