Extra blank page quando stampo (tranne in IE) - è il mio css di stampa?

Sto usando print css per nascondere alcuni elementi e anche per interrompere le interruzioni di pagina quando non le desidero. L'utente può scegliere di nascondere le sezioni prima che vengano stampate.Extra blank page quando stampo (tranne in IE) - è il mio css di stampa?

Il mio problema è che quando stampo un'anteprima c'è sempre una pagina bianca extra (alla fine in Chrome e Firefox, e all'inizio in Opera) e non riesco a capire perché. IE non ha problemi, nessuna pagina in più (che è scioccante ...)

Apprezzerei molto qualche input. Ho provato a rendere il contenitore div-break-after dopo: evitare; e page-break-after: auto; ma nessuno dei due ha funzionato. Togliendo anche la table.plain {page-break-inside: avoid; } non ha fatto la differenza.

La classe di esclusione viene aggiunta a una tabella quando l'utente fa clic sull'icona Nascondi. Funziona e qualsiasi cosa con la classe di esclusione non viene visualizzata nella stampa. L'ultima pagina che l'utente vuole stampare può adattarsi a una pagina o no.

Ecco il mio html:

<body> 
    <div id="main"> 
     <div id="content"> 
      <div id="side" class="exclude"> 
       ...logo, etc, shown at side on screen... 
      </div>    
      <div id="data"> 
       <table class="printOnly plain printHeader"> 
        ...logo, etc, to print at top... 
       </table>     
       <div> 
        <table class="detail plain"> 
         <tbody> 
          <tr> 
           <td class="rel"> 
            <div class="abs exclude visibility"> 
             <a href="#" class="show ico-show ico hid">Show</a> 
             <a href="#" class="hide ico-hide ico">Hide</a> 
            </div> 
            <h3>Contact</h3> 
           </td> 
          </tr> 
          ...more tr with contact details... 
         </tbody> 
        </table> 
        ...more tables with other details... 
       </div> 
      </div> //data 
     </div> //content 
    </div> //main 
</body>

Ecco il mio css di stampa:

@media print { 
    .exclude { 
     display: none !important; 
    } 

    .printOnly { 
     display:block !important; 
    } 

    div#data, 
    div#data div { 
     width: 98% !important; 
     border: none !important; 
    } 

    table.plain { page-break-inside:avoid; } 
}

Molte grazie in anticipo per il vostro aiuto :)

fonte

2013-06-17 tekiegirl

Non che dovrebbe importare , ma hai provato a impostare un'altezza di 0 sugli elementi esclusi? – Nix

Specifica le versioni di IE con cui hai problemi. – Spudley

@Nix - grazie per il suggerimento, ma non ha fatto differenza. – tekiegirl

sto andando suggerire di provare utilizzando un reset CSS. I reimpostamenti dovrebbero aiutare i diversi browser a visualizzare il sito allo stesso modo. Potresti provare quello a http://meyerweb.com/eric/tools/css/reset/ ma non l'ho mai usato quindi non posso davvero dire come funzionerà. Puoi anche provare a cercare su Google un ripristino CSS specifico per gli stili di stampa.

fonte

2013-06-22 23:43:45 Shikayaru

Per Firefox: se la pagina vuota è visibile all'anteprima di stampa, andare a stampare -> impostazione pagina e ridurre la scala finché il bianco non scompare dall'anteprima di stampa. Questo ha funzionato per me.

fonte

2014-02-27 07:32:16 user3359364

maggior parte delle volte è necessario specificare

html, body { width: 100%; height: 100%; }

Il driver di stampa in quanto il browser utilizzato non come questo. Quindi per risolvere questo basta aggiungere questo al tuo file print.css

html, body { height: auto; }

Niente più stampa di pagine vuote.

la soluzione è spiegato in questo page speranza aiuta tutti

fonte

2014-03-11 08:52:54

Risolto per me. L'ho implementato utilizzando una query multimediale in SCSS. –

Per risolvere questo problema utilizzando una media query al posto di un print.css separata, provare quanto segue:

html, body { 
    height: 100%; 
    @media print { 
     /* This fixes an issue where when printing a selection, 
     an extra blank page is printed in IE10 and IE11. 
     Solution found here: http://stackoverflow.com/a/22320644/7752 */ 
     height: auto; 
    } 
}

fonte

2016-06-28 15:37:05

Extra blank page quando stampo (tranne in IE) - è il mio css di stampa?

risposta

Problemi correlati