How to Control Page Breaks in Large Tables with CSS?

How to Force Page Breaks with CSS for Large Tables

When working with dynamic tables containing numerous rows, it becomes imperative to control page breaks for better print presentation. CSS offers two essential properties for this purpose: page-break-before and page-break-after.

To ensure page breaks as needed, the following code can be implemented:

table { page-break-inside:auto }
tr    { page-break-inside:avoid; page-break-after:auto }

The page-break-inside property on the table element is set to auto, indicating that the browser will automatically determine when to insert page breaks within the table.

For individual rows (tr), the page-break-inside property is set to avoid, preventing page breaks from occurring within a row. The page-break-after property is set to auto, causing a page break to occur after each row.

Refer to the W3C's CSS Print Profile specification for detailed guidelines on CSS print properties. Additionally, the Salesforce developer forums provide valuable discussions and insights on CSS for printing scenarios.

The above is the detailed content of How to Control Page Breaks in Large Tables with CSS?. For more information, please follow other related articles on the PHP Chinese website!