ansaurus

Question

How to deal with page breaks when printing a large HTML table

Answer 1

+2 A:

Use these CSS properties:

page-break-after

page-break-before

For instance:

<html>
<head>
<style>
@media print
{
table {page-break-after:always}
}
</style>
</head>

<body>
....
</body>
</html>

via

marcgg 2009-11-19 14:26:00

It works on table rows ?

h3 2009-11-19 14:27:00

I'm not sure, you'll have to check. If not, split into different arrays and separate the arrays by an empty div

marcgg 2009-11-19 14:27:34

(or on the "table" element)

marcgg 2009-11-19 14:28:24

You will have to apply it to the table row or even cell, but not to the table, I think. Other than that, it should work.

Pekka 2009-11-19 14:29:16

Answer 2

+9 A:

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

Sinan Ünür 2009-11-19 14:31:42

This does not work in all browsers. It does seem to work in FireFox 3.6 Mac OS.

daustin777 2010-10-08 14:23:31

ansaurus

tags:

views:

answers:

How to deal with page breaks when printing a large HTML table

related questions