Drucken eines Chat-Links in Chrome zusammen mit Seiteninhalt, der ein Bug ist

Question

Ich habe eine Webseite (Angular HTML5, CSS3, mvc gemacht) und es hat einige Inhalte drin. Benutzer kann es drucken (Es gibt keine separate Drucktaste, aber man kann mit der rechten Maustaste klicken und Drucken auswählen). Jetzt druckt es den Inhalt, aber zusammen mit dem Inhalt wird auch die Überschrift oder der Inhalt eines Chat-Links gedruckt (kleine Popup-Box, die sich öffnet, wenn Sie darauf klicken). Ich möchte nicht, dass die Überschrift oder der Inhalt dieses Leuchtkastens gedruckt wird, was in IE, Firefox der Fall ist, aber in Chrome gibt es auch den Leuchtkasten aus :(

Auf meiner Suche fand ich das, hilft mir , aber ich weiß nicht, wo die Klasse nicht-Print zu verwenden, wie ich in meinem Code keine separate Drucktaste oder Funktionalität.

How do I hide an element when printing a web page?

Bitte

Answer 1

Hilfe beantragen Sie die nicht-Druck-Klasse zu den Elementen, die Sie ausblenden möchten, wenn ein Benutzer druckt, z. B. Ihr Chat-Popup.

<header class="no-print"> 
    <h1>My app</h1> 
</header> 
<p>Content</p> 
<div class="no-print"> 
    <h1>Chat popup</h1> 
</div> 

Der Inhalt würde gedruckt, aber der Header und Chat-Dialog nicht.