Warum wird diese Website in Chrome für Windows leer gedruckt? Es ist makellos auf meinem Mac. (@media print)

Question

Also arbeite ich gerade an einer Web-Anwendung, die eine Liste Clients mit einer Liste von Transaktionen darunter zeigt. Benutzer müssen die Möglichkeit haben, das Transaktionslog eines einzelnen Kunden oder alle Transaktionen zu drucken.

Ich verwende Tabellen, um die Daten anzuzeigen. Im @media Druck CSS, habe ich folgendes:

table{ 
    display:none; 
} 
table.show-data-block{ 
    display:table; 
} 

Zunächst werden alle Tabellen haben die Klasse .show-Daten-Block. Allerdings binden ich Drucktasten (neben dem Client-Namen befindet) mit dem folgenden:

$('.print-log').click(function(e){ 
     $('.show-data-block').removeClass('show-data-block'); 
     //I know, lots of nesting   
     var clientTable=$(this).parent().parent().parent().parent(); 
     if(!$('.'+$(clientTable).data('owns')).length<=0){ 
      $(clientTable).addClass("show-data-block"); 
     } 
     $('.'+$(clientTable).data('owns')).addClass("show-data-block"); 
     window.print(); 
     //just to be safe 
     setTimeout(function(){ 
      $('table').addClass('show-data-block'); 
     },500); 
    }); 

On Chrome für Windows, das ist das Ergebnis: Frustrating Printing Error \

Doch aus irgendeinem Grund, wenn jemand klickt den Knopf ein zweites Mal, es wird korrekt angezeigt. Auf meinem Mac (Chrome) wird es beim ersten Mal korrekt angezeigt.

Unsere Verträge mit Kunden geben uns den Luxus, nur für Chrome zu entwickeln, also muss dies nur in Chrome funktionieren.

Kann jemand das beheben? Ich habe versucht, es so lange herauszufinden, und Benutzer/Kunden erkennen nicht, dass die Optimierung für das Drucken im Web eines der frustrierendsten Dinge ist, die Sie einem Webentwickler jemals geben können. :(

Answer 1

Also habe ich dieses Problem gelöst. @aardian hatte Recht, ein Teil des Problems war die Tatsache, dass ich eine benutzerdefinierte Schriftart verwendet habe. Ich erkannte, dass die Vorlage die Schriftart auf "Open Sans" setzt dies löste das Problem:

table tr > *{ 
    font-family:"Helvetica",sans-serif !important; 
    /*This ensures the font renders properly.*/ 
    color:#000 !important 
    /*There are no styles setting the font to white but for some reason, this was needed.*/ 
}