layout per stampa

**nikasil** · 18-02-2012, 19:48

allora ho l'esigenza di stampare dei documenti/dati che abbiamo un header e footer fisso per ogni foglio.

ho trovato questo sul web e funziona ma con explorer, con chrome no.....come si può modificare in modo che funzioni con quello anche?

codice:


<html>
<head>

<title>Scrollable Table with Fixed Header, repeat print header and footer</title>

<meta name="keywords" content="fixed table header; non-scroll header; fixed
footer; freeze header; CSS tips; print repeating headers; print repeating
footers">

<link rel="stylesheet" href="basic.css" type="text/css">

<style type="text/css">

div.tableContainer {
width: auto; /* table width will be 99% of this*/
/*height: 295px; /* must be greater than tbody*/
overflow: auto;
margin: 0px;
}

table {
width: 99%; /*100% of container produces horiz. scroll in Mozilla*/
border: none;
background-color: #FFFFFF;
}

table>tbody { /* child selector syntax which IE6 and older do not support*/
overflow: auto;
/*height: 250px;*/
overflow-x: hidden;
background-color: #FFFFFF;
}

thead tr {
position:relative;
top: expression(offsetParent.scrollTop); /*IE5+ only*/
background-color: #FFFFFF;
}

thead td, thead th {
text-align: center;
border-bottom: 1px solid #999999;
background-color: #FFFFFF;
}

td {
text-align: justify;
background-color: #FFFFFF;
}

tfoot td {
text-align: center;
border-top: 1px solid #999999;
background-color: #FFFFFF;
}

td:last-child {padding-right: 20px;} /*prevent Mozilla scrollbar from hiding cell content*/

</style>


<style type="text/css" media="print">

div.tableContainer {overflow: visible; }
table>tbody {overflow: visible; }
td { } /*adds control for test purposes*/
thead td { }
tfoot td {
text-align: center;
border-top: 1px solid #999999;
}

thead {display: table-header-group; }
tfoot {display: table-footer-group; }
thead th, thead td {position: static; }

</style>

</head>
<body>

<div id="container">
<div class="tableContainer">
<table cellspacing="0">
<thead>
<tr>
<td>HEADER</td>
</tr>
</thead>
<tfoot>
<tr>
<td>FOOTER</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>Contenuti bla bla bla bla bla

</td>
</tr>
</tbody>
</table>

</div>

</div>

</body>

</html>

**Vincent.Zeno** · 18-02-2012, 22:23

@nikasil

ricorda che, come tutti, sei tenuto ad utilizzare il tag CODE per postare codice. grazie

non funziona bene nemmeno si opera e safari
forse è il caso di cambiare strategia?

**nikasil** · 18-02-2012, 23:33

a scusa...per il tag CODE....

per cambiare strategia....mi consigli qualcosa?

**Vincent.Zeno** · 18-02-2012, 23:41

cerca Page break Property in css
anche qui www.w3schools.com

**nikasil** · 20-02-2012, 11:01

mah...nella mia infinita stupidità ne sò quanto prima; vedo CSS page-break-inside, after e before....ma non ho capito dove/come metto l'header, come il footer e come i dati tra i due...

codice:

<html> <head> <style> @media print { table {page-break-inside:avoid} } </style> </head> <body> .... </body> </html>

inside per dire sarebbe da utilizzare per i dati, before per header, before per footer? boh

**nikasil** · 20-02-2012, 11:43

ho trovato questo esempio che m'ha fatto capire di +

codice:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Documento senza titolo</title> <style> h2 { page-break-before: always } </style> </head> <body> <h1>Titolo dell’articolo</h1> 

Questo paragrafo costituisce un’introduzione all’articolo

 <h2>Primo capitolo</h2> 

Paragrafo 1

 

Paragrafo 2

 [...] 09. <h2>Secondo capitolo</h2> 

Paragrafo 1

 

Paragrafo 2

 </body> </html>

ma quello che nn ho capito....è come faccio a far si che l'header di una tabella, tanto per fare un esempio, mi venga stampata in testa ad ogni foglio mentre i contenuti sotto ovviamente sono progressivi?

**Vincent.Zeno** · 20-02-2012, 14:12

per favore le prossime volte assicurati di aver indentato ben il codice,
altrimenti non si legge

da quel che ho capito tu stai cercando una soluzione che facca da sola,
invece devi prepararla tu.

nella pagina stampi l'header, poi i tuoi N record, poi il footer
quindi al footer applichi page-break-after:always

**nikasil** · 20-02-2012, 14:27

provo

Discussione: layout per stampa

Strumenti discussione

Ricerca discussione

Visualizza

layour per stampa

Permessi di invio