CSS-Zusammenfassung unvollständig

**krischanski** · 16.10.2013, 15:02

Ich habe mehrere CSS-Dateien angelegt, bei der Zusammenfassung werden aber nicht alle in eine Datei gepackt, sondern eine ausgelassen und separat ausgegeben.

Konkret:
- screen.css (media=screen), screen_narrow.css (media=screen, außerdem media-query) und print.css (media=print) werden zusammengefasst und als eine zufällig benannte Datei eingebunden.
- all.css (media=all) wird extra und dummerweise nach der zusammengefassten Datei eingebunden.

Wie kann ich erreichen, das auch all.css in die gemeinsame Datei eingegliedert wird?

uwe · 16.10.2013, 15:31

Hast du der all.css testweise schon mal media=screen gegeben?
Welchen Sinn macht media=all, wenn du eine print.css hast?

**Andreas** · 16.10.2013, 22:13

Hab's gerade mal in einer 2.11.10 ausprobiert. Bei mir funktioniert das. Die Reihenfolge stellst du ja im Layout ein. Das einzige was noch vor den CSS-Dateien aus dem Layout eingebunden wird, ist eine Reset-CSS von Contao, die tinymce.css und z.B. die mediabox.css.

@uwe In die media all CSS kommt die Formatierung, welche für screen und print (und eben alle anderen) gemeinsam vorhanden sein soll. Man könnte höchstens bemängeln, dass ein media-type für all überhaupt angegeben wird, das wäre nämlich nicht nötig. Wenn kein media-type angegeben ist, wird es sowieso für alle Ausgabegeräte genommen.

uwe · 17.10.2013, 11:02

Ich habe auch noch mal getestet. In einer 2.10.2 und 3.1.2 geht eine media=all Datei mit in die Zusammenfassung.

Frage @Andreas bei der Gelegenheit:
Ich finde es praktisch, das Standardlayout mit media=screen zu formatieren. Den Vorteil sehe ich darin, dass dann die Printausgabe unformatiert, also für den Druck schon mal grundsätzlich geeignet ist, und bräuchte eine media=print nur noch für Spezielles.

Vernachlässige ich so dann irgendwelche Ausgabegeräte?

**Andreas** · 17.10.2013, 12:47

@uwe Kommt halt auf das Projekt an. Manchmal hat mans lieber unformatiert und manchmal möchte man, z.B. die Überschriften, Ränder usw. wie auf dem Screen haben.

Ja, mit Screen schließt du alle Ausgabegeräte aus, die nicht auf Screen ansprechen

Welche das jetzt genau sind, kann ich dir auch nicht sagen. Ich würde aber zumindestens tv und projection mit einschließen.

Ich mache selten Drucklayouts. Und da ich nur mit externen Dateien arbeite, schreibe ich den media-query direkt in die Datei. "all" schreibe ich aber nie da rein, wird ja ohne query automatisch für all genommen. Also ich habe meistens nur irgendwo einen media-print drin. Ich würde die print ganz zum Schluss machen. Sehen, wie die Druckausgabe mit dem CSS aussieht und dann das nötige ändern.

**krischanski** · 17.10.2013, 13:32

Zitat von uwe

Hast du der all.css testweise schon mal media=screen gegeben?

Ja, alle möglichen Kombinationen hab ich ausprobiert, aber dann ändert sich immer nur die media-Angabe im Link-Element, die Datei wird aber weiterhin separat eingebunden.

Zitat von Andreas

Das einzige was noch vor den CSS-Dateien aus dem Layout eingebunden wird, ist eine Reset-CSS von Contao, die tinymce.css und z.B. die mediabox.css.

Die hab ich alle rausgeschmissen. Kann es was damit zu tun haben?

Zitat von Andreas

Man könnte höchstens bemängeln, dass ein media-type für all überhaupt angegeben wird, das wäre nämlich nicht nötig. Wenn kein media-type angegeben ist, wird es sowieso für alle Ausgabegeräte genommen.

Kein Häkchen setzen lässt das Backend aber auch nicht zu. Und die zusammengefasste CSS-Datei wird ja auch mit media=all eingebunden.

**Andreas** · 17.10.2013, 14:29

Zitat von krischanski

...Die hab ich alle rausgeschmissen. Kann es was damit zu tun haben?...
...Kein Häkchen setzen lässt das Backend aber auch nicht zu. Und die zusammengefasste CSS-Datei wird ja auch mit media=all eingebunden...

Keine Ahnung was du da gemacht hast. Ich kann dir nur sagen, wie das Standard-Verhalten ist. Wie hast du alles raus geschmissen?

Ich weiß, aber "all" ist ja so als hättest du keinen media-query. Und die gemeinsame Datei muss mit all eingebunden werden. Innerhalb der gem. Datei sind dann die media-querys der einzelnen Dateien. Mal mit den Dev-Tools vom FF ansehen.

**krischanski** · 17.10.2013, 15:13

Ich denke, ich habe die Ursache gefunden: im all.css steckt auch eine @font-face-Anweisung, und die darf ja nicht innerhalb einer @media-Klammer stehen, wie ich soeben gelernt habe. Ich werde also einfach die Schrift-Anweisungen auslagern, dann sollte es gehen. (Ich glaube zwar, das schon erfolglos genau so probiert zu haben, aber ich bin zuversichtlich.)