Sto lavorando su un elenco stampabile di eventi, la stampante stampa una pagina fine, ma taglia parte del testo in basso, quindi stampa una seconda pagina vuotafoglio di stile di stampa, una pagina stampa e taglia il testo rimanente
Ho provato tutto quello che so ma sono in perdita.
In print.css, impostare overflow: visible anziché overflow: auto su div#content. Questo lo ha risolto per me almeno in Firefox. La definizione di overflow automatico è: "Se l'overflow è troncato, è necessario aggiungere una barra di scorrimento per vedere il resto del contenuto", ma le barre di scorrimento non esistono sulle pagine stampate.
Suppongo che, dal momento che il contenuto div deve estendersi su più pagine, il browser pensa "stai fluendo all'esterno del contenitore e deve essere ritagliato con una barra di scorrimento". Il contenitore in quel caso è la prima pagina in cui appare il div del contenuto.
Sei già utilizzando il valore print per l'attributo media per il vostro foglio di stile come
<link rel="stylesheet" href="print.css" media="print" />
Si potrebbe anche decidere di utilizzare page-break-before attributi per gli elementi che non si desidera rompere.
sì, il foglio di stile di stampa viene assolutamente utilizzato pagina è in realtà solo una lunga lista di tabelle, non voglio davvero un'interruzione di pagina prima ognuno – mjr
Se uno qualsiasi dei contenitori che si sta tentando di stampare è flottato, verrà interrotto come si vede.
Nel tuo print.css, assicurati di disattivare tutto il floating che puoi senza distruggere il layout. È un problema, ma il supporto del browser per la stampa è debole al meglio.
Ho appena risolto questo problema in ie7. Questo era in un progetto Sharepoint, che aveva diverse celle di tabella e/o div in altezza: 100%. Una volta stampato, stamperebbe i moduli lunghi, la prima pagina o 2 verrebbero stampati come al solito, quindi le pagine bianche invece del resto.
Nel mio foglio di stile di stampa, ho impostato le tabelle & div all'altezza: auto, e ora stampa bene.
Sto avendo un problema diverso in IE8 ora. UGH!
Ho risolto il problema aggiungendo overflow:visible; e gli ho dato padding-right: 30px; per sostituire la larghezza delle barre di scorrimento.
Non è così utile. Non è chiaro a quale elemento hai aggiunto questi stili. – cchamberlain
Ho trovato che l'impostazione display: inline su container divs ha aiutato anche. Alcune di queste grandi risposte qui hanno funzionato per me in certe situazioni mentre in altre no.
<div class="container">
<div class="content-cutting-off-here">
Some long text that gets cut off at the end of the page...
</div>
</div>
La maggior parte delle persone impostare contenitori da mostrare block o inline-block. Per me stava tagliando il testo, e impostandolo su inline lo ha eluso. Questo rende anche irrilevante width e height per il contenitore offendente; che ho trovato essere una seccatura durante la stampa.
@media print {
.container {
display: inline;
}
}
se overflow:visible; non funziona, provare overflow-y:visible;
(avevo body{overflow-y:scroll;}, e body{overflow:visible;} in print.css non riscritto esso ...)
Im usando @print {}, 'body {overflow: visible;}' lo ha fatto per me. – JerryA
So che questa è una vecchia domanda, ma ecco un altro, più nuovo modo in cui ciò può accadere.
Verificare se si sta utilizzando display: flex; sull'elemento ritagliato. Era il problema per me, impostandolo su block risolto.
Non sembra funzionare in Chrome, ma funziona bene per me in IE. –
Lo stesso qui Jack Thor. Hai trovato una soluzione? –
Ha lavorato per me in cromo. Ero pigro e ho appena aggiunto '* {overflow: auto! Important; } ' –