2012-03-21 12 views
5

mi problema es que tengo dos archivos html diferentes con una tabla que contiene theader, tfooter y tbody.La vista previa de impresión se repite en cada página

el primero es mi propia creación por razones de prueba y se ve así:

<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> 

siempre que intente la vista preliminar de IE9 muestra la tfoot en la última página (página 5 en mi caso) que muestra la suma global de la columna de precio del contenido corporal. cuando intento lo mismo en Mozilla Firefox 11.0, muestra el tope con la suma general en cada página que no quiero, por supuesto.

la razón principal por la que estoy preguntando es porque tengo un dom HTML FreeAgent donde quiero imprimir alguna factura. Con ese archivo html incluso IE9 muestra el tfoot en cada página, que, de nuevo !, no lo quiero.

He jugado un poco con

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

no se nota al pie de página sólo una vez, pero en la primera página en la parte inferior izquierda cruzando todo el resto de mi texto ...

ideas o soluciones mucho ¡apreciado! :)

Respuesta

2

Se supone que el tfoot "siempre estará visible en la parte inferior" (o algo así), por lo que tiene sentido que Firefox imprima el pie de página en la parte inferior de la tabla en cada página.

En particular, esto es útil si tiene celdas de encabezado de tabla para nombrar columnas, o si usa el pie de página como una etiqueta o encabezados repetidos.

Probablemente debería tener su suma como una fila más al final de la tabla.

3

Pruebe este CSS en su hoja de estilo de impresión, hará que el tfoot actúe como otra fila pero manteniendo la sintaxis adecuada que necesita algo como Datatables.net.

table tfoot{display:table-row-group;} 
Cuestiones relacionadas