pagina aggiungendo Firefox pause prima grande blocco div quando si stampa

mi hanno un po 'di logica in uno dei miei punti di vista Rails che stabilisce se il table sto per stampare è più di 7 righe, creare un div intorno al table con un min-height stile per assicurarsi che il piè di pagina sotto questo table passi alla fine della pagina 2, anziché a 1. 1.pagina aggiungendo Firefox pause prima grande blocco div quando si stampa

Ho provato questa logica in molti browser tra cui: Chrome, Safari e IE (!) e funzionano tutti come previsto. Firefox, tuttavia, aggiunge una fastidiosa interruzione di pagina subito prima dello div e table. Ho provato a evitare questa interruzione di pagina aggiungendo questo stile CSS nello div e anche nello: page-break-before: avoid; e in questo nuovo stile di Firefox: break-before: avoid;, ma non sembra influire su questa interruzione di pagina durante la stampa. Altre idee? Firefox aggiunge automagicamente un'interruzione di pagina prima di div grandi durante la stampa?

<div style='min-height: 1150px;'> 
    <table> 
    blah blah table stuff... 
    </table> 
</div>

fonte

2013-07-07 user2203451

Secondo [questa pagina] (https://developer.mozilla.org/en-US/docs/Web/CSS/break-before #Browser_compatibility), 'break-before' non esiste ancora. Fino a quando non lo fa, usa 'page-break-before'. –

grazie, ma ho provato il page-break-before: evitare; in entrambi i tag div e in table. non ha funzionato qualche altro suggerimento? – user2203451

A questo punto ho modificato il selettore di altezza minima in altezza e funziona come dovrebbe quando si stampa da tutti i browser. Non esattamente la soluzione che volevo, ma per ora ha il compito di fare. Mi piacerebbe una soluzione reale per l'altezza minima in Firefox se qualcuno ha una soluzione. – user2203451

bene, perché non abbiamo esempio vivo del codice è purtroppo molto difficile da dito fuori la soluzione, ma la buona notizia è che posso fornire alcune informazioni su di esso potrebbe opere, ma non è sicuro.

Inserire sempre un'interruzione di pagina prima di ogni elemento (durante la stampa).
Non è possibile utilizzare questa proprietà per (vuoto div) o con (posizione: assoluta;).
Prima di utilizzare interruzione di pagina prima dello, controllare se è possibile utilizzare break-before invece.
Evita l'interruzione di pagina prima dell'elemento (se possibile), quindi non è garantito il funzionamento, motivo per cui ti chiediamo di fornire alcuni esempi dal vivo per lavorarci.
Prova ad utilizzare interruzione di pagina prima: eredita; nella seconda pagina fino alla seconda pagina in cui si fa parte della prima parte della pagina (quindi se si dispone di un vassoio tabella per sapere dove si trova l'ultima parte della prima pagina e aggiungere page-break-before: evitare;, break-before: evitare;, break-before: inherit; o page-break-before: inherit;).
se non cercare di utilizzare (colonna-break-before: evitare; o -moz-column-break-before: evitare;) prima dell'inizio della seconda pagina o (colonna-break-inside : evitare; o -moz-column-break-inside: evitare;).
Se non si prova a utilizzare interno pagina interna o break-inside potrebbe non essere all'interno del freno.

Spero che questo ti aiuti a risolvere il tuo problema e fammi sapere quale più funziona per te. Fammi sapere se hai qualche domanda.

fonte

2015-06-10 04:54:03

Se si desidera ottenere la migliore risposta anche perché non si ringrazia, –

provare questo codice, e questo risolverà la query

<!DOCTYPE HTML> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>Test</title> 
<style type="text/css"> 
    table { page-break-inside:auto; border-collapse: collapse } 
    tr { page-break-inside:avoid; page-break-after:auto } 
    thead { display:table-header-group } 
    tfoot { display:table-footer-group } 
</style> 
</head> 
<body> 
    <table> 
     <thead> 
      <tr><th>heading</th></tr> 
     </thead> 
     <tfoot> 
      <tr><td>notes</td></tr> 
     </tfoot> 
     <tr> 
      <td>x</td> 
     </tr> 
     <tr> 
      <td>x</td> 
     </tr> 
     <!-- 500 more rows --> 
     <tr> 
      <td>x</td> 
     </tr> 
    </tbody> 
    </table> 
</body> 
</html>

fonte

2015-06-10 10:49:13

La soluzione è venuta dalla rimozione della proprietà css "border-collapse". Se lo aggiungi alla tua risposta ti darò la taglia in 5 ore. –

troppo tardi, l'ho dato all'altro ragazzo –

che non è come funziona. puoi assegnare una taglia a una sola persona. –

pagina aggiungendo Firefox pause prima grande blocco div quando si stampa

risposta

Problemi correlati