2012-03-21 12 views
5

il mio problema è che ho due diversi file html con una tabella contenente theader, tfooter e tbody.L'anteprima di stampa si ripete in ogni pagina

il primo è una mia creazione, per motivi di test e sembra che questo:

<html> 
<head> 
    <title>The Invoice</title> 
    <style type="text/css"> 

    table.invoice { background-color: #dddddd; font-family: sans-serif; } 

    td, th { background-color: #ffffff; padding: 5pt; } 
    td.unit { text-align: right; } 
    td.price { text-align: right; } 

    thead { display: table-header-group; } 
    tfoot th { text-align: right; } 

    </style> 
</head> 
<body> 
    <div style="width:auto !important; overflow:hidden; position:relative"> 
    <table class="invoice" cellspacing="1" cellpadding="0"> 
     <thead> 
      <th>Unit</th> 
      <th>Description</th> 
      <th>Price</th> 
     </thead> 
     <tfoot> 
      <tr> 
      <th colspan="2">Sum</th> 
      <td class="price">1.230,32 EUR</td> 
      </tr> 
     </tfoot> 
     <tbody> 
       <tr><td>1</td><td>Excel</td><td >150,00 EUR</td></tr> 
       <tr><td>2</td><td>Document</td><td>150,00 EUR</td></tr> 
          ... and so on ... 
     </tbody> 
    </table> 
    </div> 
</body> 
</html> 

ogni volta che provo l'anteprima di stampa su IE9 mostra la TFOOT nell'ultima pagina (pagina 5 nel mio caso) che mostra la somma complessiva della colonna del prezzo del contenuto del corpo. quando provo la stessa cosa in Mozilla Firefox 11.0 mostra il piede con la somma complessiva su ogni pagina che non voglio ovviamente.

il motivo principale che sto chiedendo è perché ho un dom in html di FreeAgent dove voglio stampare qualche fattura. Con quel file html anche IE9 mostra il tfoot su ogni pagina, che, ancora una volta !, non voglio.

Ho suonato in giro con

@media print { tfoot { display: table-footer-group; 
       position: absolute;   
       bottom: 0; }} 

ci mostra il piè di pagina solo una volta, ma sulla prima pagina in basso a sinistra tutto attraversato il resto del mio testo ...

idee o soluzioni molto apprezzato! :)

risposta

2

Lo tfoot in realtà dovrebbe "essere sempre visibile nella parte inferiore" (o qualcosa del genere), quindi è logico che Firefox stampi il piè di pagina nella parte inferiore della tabella in ogni pagina.

In particolare, questo è utile se si dispone di celle di intestazione di tabella per il nome di colonne o si utilizza il piè di pagina come un'etichetta o intestazioni ripetute.

Probabilmente dovresti avere la somma come solo un'altra riga all'estremità del tavolo.

3

Prova questo CSS nel tuo foglio di stile di stampa, farà sì che il tfoot funga da un'altra riga pur mantenendo la sintassi corretta che ha bisogno di qualcosa come Datatables.net.

table tfoot{display:table-row-group;} 
Problemi correlati