Errore durante la stampa di una tabella Bootstrap su Chrome

Question

Ho un bug strano quando voglio stampare la mia pagina Web su Chrome. Visualizzo una tabella usando Bootstrap, che si adatta perfettamente alle dimensioni dello schermo (qualunque sia la dimensione dello schermo). Quando voglio stampare la pagina Web sotto Chrome, la tabella viene ritagliata, mentre il layout di stampa è perfetto con Firefox.

Sono riuscito a riprodurre il mio bug su JSFiddle here.

il codice HTML del mio tavolo è:

<table class="table table-condensed"> 
    <thead> 
     <tr> 
      <th>Col1</th> 
      <th>Col2</th> 
      <th>...</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr ng-repeat="..."> 
      <td>...</td> 
      <!-- ... --> 
     </tr> 
     <tr class="separator empty" /> 
    </tbody> 
</table> 

Avete qualche idea per risolvere questo problema?
Forse si sta utilizzando una classe di css Bootstrap diversa per la tabella?

Answer 1

Specificare una dimensione di zoom iniziale stampato tutto il contenuto.

@media print { 
    body { 
     zoom: .8 
    } 
} 

Fiddle: http://jsfiddle.net/HB7LU/11671/

Answer 2

C'è un bug noto in Bootstrap 3 che sembra sia stato rimandare a Bootstrap 4. Il bug è a che fare con la reattività di essere applicata in stili stampati.

Nel mio caso, la modifica di tutte le mie classi col-sm-* su col-xs-* ha funzionato benissimo.