Ich habe früher an einem Druck-Stylesheet gearbeitet und bin auf ein Problem mit IE8 gestoßen. Ich verwende HTML5 und mehrere Layout-Tags einschließlich Header, Nav und Footer.
Aus irgendeinem Grund in meinem Druck-Stylesheet die Anzeige: keine; Die Deklaration dieser Tags wird im IE8 ignoriert (und ich kann nur von niedrigeren Versionen ausgehen). Ich dachte zuerst, dass Entwickler-Tools in IE9 eine falsche Darstellung verursachen könnte, aber ich habe eine Windows XP-Installation in VirtualBox, die das Problem auch zeigt.
Ich schätze, weil HTML5-Tags von nichts unter IE9 gesehen werden. Das Druck-Stylesheet verbirgt die Layout-Tags in Firefox und Chrome.
Gibt es überhaupt etwas, um das zu umgehen?
Bearbeiten:
Hier ist, was ich gerade habe:
%Vor%Ignoriere die PHP-Anweisungen, sie sind spezifisch für mein CMS, das WordPress ist.
Dann verstecke ich einfach die Layout-Tags in der print.css:
%Vor%Dies funktioniert für IE9, Firefox, Chrome aber nicht in etwas niedriger als IE9. Es scheint HTML5-Tags zu ignorieren.
Verwenden Sie Modernizr . Stellen Sie im Extra sicher, dass html5shiv / w printshiv ausgewählt ist. Fügen Sie diese Javascript-Bibliothek auf Ihrer Website ein und es sollte wie ein Zauber wirken.
Da ich nur raten kann, ohne den Code tatsächlich zu sehen, wäre meine erste Vermutung, dass die html5 shiv nach den css-Deklarationen verwendet wird, und die css einfach die html 5-Tags überspringt, ohne die css-Styles anzuwenden Sie. Versuchen Sie, das Skript ganz oben zu setzen, bevor irgendwelche CSS-Link-Tags im Kopf erscheinen.
Sie könnten einen Workaround mit Javascript versuchen, indem Sie ein Paar Funktionen onbeforeprint
und onafterprint
einfügen, in denen Sie den Inhalt verstecken / anzeigen, der display:none
sein sollte.
Ich empfehle dringend die Verwendung von Boilerplate für Ihre Probleme. Ist eine nette Zusammenstellung für Webstandards und einige bekannte und häufige Probleme in fast jedem Browser. Es verwendet modernizr und hat ein tolles Stylesheet mit einem @ media print, das Sie für alle Druckprobleme in allen Browsern verwenden können.