print.css richtig einbinden?!

[zetlander]

Guten Tach!

ich versuche aktuell meine print.css zuerstellen und einzubinden...
Folgendes Problem: Wenn ich die print.css über mein Seitenlayout einbinde greift sie direkt in meine Seite ein (im Browser) blendet Bilder aus usw.
Das soll sie natürlich erst wenn gedruckt wird...alle css Dateien die eingebunden sind, stehn auf "screen" und die Print auf "print".

Nun habe ich unter Systemwartung Daten bereinigen betätigt jetzt bekomme ich eine komplett
weisse Seite im Browser angezeigt wenn ich die print.css im Seitenlayout einbinde??

Ich habe meine Standard css Datei kopiert und dementsprechend Bilder usw. mit display:none ausgeblendet
bzw. angepasst und als print.css angelegt.

Hat da einer einen Tipp für mich - was ich hier falsch mache?.

Contao: 2.10.4

Grüßeee & Danke schonmal

[zetlander]

...es war ein Cache Problem - nach mehrmaligem reload.
wurde die print.css so ausgeführt wie gewünscht.

[do_while]

Hallo zetlander,

ich habe meist 3 Stylesheets in den Seitenlayouts angegeben:

1) Ein Reset-Stylesheet (all) als oberstes um alle Browser auf nahezu gleiches Niveau zu bringen
2) Das Haupt-CSS (all) mit allen Styles für die Bildschirmdarstellung
3) Das Print-CSS (print), was ausgewählte Styles aus dem Haupt-CSS überschreibt, z.B. display:none; bei Navigationen, usw.

[zetlander]

Hallo danke für deinen Hinweis.

Mittlerweile habe ich ein anderes Problemchen...
Kunde möchte die website möglichst genauso ausgedruckt haben wie sie im Browser zu sehen ist!
Das Layout ist eigentlich dafür überhaupt nicht vorgesehen. Dunkle Farben im Kopfbereich mehere Logos als BG über CSS,
gekachelter Hintergrund, eingebunden grosse Headbilder im Slider usw. also eigentlich keine Site die man so 1 zu 1 ausdruckten sollte.
Also man müsste schon einige Zeit mit der print.css verbringen um alle Elemnete aufzubereitet - wenn das überhaupt sinnvoll geht...

Jetzt überlege ich was ich ohne allzuviel Aufwand anbieten könnte.
Die Website als PDF-Seiten als download zu hinterlegen?! damit würden die 100% aussehn wie im Browser
Vllt. hat jemand mit so einer Kundenproblematik Erfahrung und einen Tipp auf Lager

Danke/Grüßeee

[do_while]

Das wird schwer, denn ob der Hintergrund mit ausgedruckt wird und wie breit ausgedruckt wird, bestimmt der Browser mit seinen Druck-Einstellungen und nicht die Webseite.

Ein vorgehaltenes PDF macht natürlich mit den dynamischen Elementen nicht mit. Ich nutze für Ausdrucke der Browseransicht gern die Firefox-Erweiterung FireShot (kostet), damit könnte man ein solches PDF erstellen.

[hasenbaer]

Ich hätt dazu eine Frage:

Kann es sein, dass der IE8 ein print.css ignoriert?
Bei mir stimmt das Drucklayout in Chrome und FF, aber der IE druckt immer alles aus.

Muss ich beim IE irgendwas besonderes beachten?

LG Werner

[zetlander]

achte mal auf die Reihenfolge im Layout - bei ist print.css immer die erste.
...hatte bei mir aufjedenfall Auswirkungen.

[do_while]

Die Reihenfolge ist sehr wichtig, wenn die Styles sich gegenseitig überschreiben und abändern sollen. Die oberste CSS wird als erstes geladen, die unterste zu letzt. Bei mir ist die print.css immer die letzte, weil sie teilweise bereits definierte Styles für den Ausdruck abändern soll. Ich nutze ein CSS für all und eines für print.
Wenn man ein CSS für screen und eines für print hat, könnte die Reihenfolge egal sein, da jeweils nur eines aktiv ist.

[Eluin]

Die Reihenfolge ist sehr wichtig, wenn die Styles sich gegenseitig überschreiben und abändern sollen. Die oberste CSS wird als erstes geladen, die unterste zu letzt. Bei mir ist die print.css immer die letzte, weil sie teilweise bereits definierte Styles für den Ausdruck abändern soll. Ich nutze ein CSS für all und eines für print.
Wenn man ein CSS für screen und eines für print hat, könnte die Reihenfolge egal sein, da jeweils nur eines aktiv ist.

Genau das habe ich auch angenommen. Aber komischerweise überlagert meine print.css die restlichen Styles. Und ich habe keine Idee weshalb. Die contao-check.php gibt mir keine Fehler aus und alle Styles stehen auf "Screen" nur die print.css auf "print". Die Print.css ist dennoch überall in den Layouts als letztes eingebunden. Irgendjemand eine Idee, wonach ich noch gucken könnte? In der System-Wartung wurde auch alles neu generiert... Die Styles an sich sind auch alle entsprechend vorhanden, wie sie sollen. Sie überlagern sich nur.

[do_while]

Hallo Eluin,

das soll auch so sein, dass alle Styles immer in den CSS-Dateien vorhanden sind. Nur die print-Styles werden von den Browsern bei der Anzeige nicht verwertet, sondern nur bei Print-Ausgaben. Und dann sollen sie auch die Möglichkeit haben, alle anderen Styles umzuschreiben (zu überlagern), um Änderungen gegenüber der Displayversion zu machen.

[Eluin]

Huhu do_while,

Und dann sollen sie auch die Möglichkeit haben, alle anderen Styles umzuschreiben (zu überlagern), um Änderungen gegenüber der Displayversion zu machen.

meinst du hiermit die Browser oder die Print.css? Ich dachte Styles in der Print.css sollen keine Auswirkungen auf die Anzeigen am Monitor haben, oder habe ich das falsch verstanden?

Vielen Dank dir

Eluin

[do_while]

Das tun sie auch nicht, denn das print.css muss natürlich nur für den Medientyp print sein.
Wohingegen mein haupt.css alle Medientypen bedient, damit dadurch ein Grundlayout entsteht. Das nachgeschaltete print.css ändern (nur für Ausdrucke) einige Styles noch einmal ab, z.B. unterdrücke ich meist die Navigation im Ausdruck, da sie dort sowieso auf Papier nicht funktioniert (z.B. mit .mod_navigation {display:none;}).

Wenn das haupt.css nicht auch für Print gelten würde, müßtest Du einen Großteil der Styles doppelt pflegen.

[Eluin]

Ja, genau das habe ich bislang auch immer gedacht, dass es so funktionieren soll. Nur irgendwas läuft bei mir da grade quer. Wenn ich z.B. bei den Spalten sage: Im Print sollt ihr eine Breite von 100% haben, dann wird das auch auf den Screen übertragen. Nicht im CSS selbst, sondern wirklich nur in der Ausgabe. Und das verstehe ich einfach nicht, da das print.css auf print und der Rest auf Screen eingestellt ist

[do_while]

Hast Du mal einen Link, wo man sich das anschauen kann?