Automatic and Custom Page Breaks, Keep Together
The converter supports the following CSS styles to control the page breaks:
For example, with the page-break-after: always style applied to a HTML element (image, text, etc) you instruct the converter to insert a page break right after that element is rendered.
An advanced and very useful feature when creating PDF reports is the Keep Together feature which can be implemented with the page-break-inside: avoid style. This instructs the converter to avoid breaking the content of a group of HTML elements you want to keep together on the same page. If you think you can apply this style to a table, a table row or a div element you can easily understand the utility of this feature.
Below is an example of using the page-break-inside: avoid style. The table contains a large number of rows, each row containing an image in the left and a text in the right and we don't want a row to span on two pages.
<table> <tr style="page-break-inside: avoid"> <td> <img width="100" height="100" src="img1.jpg"> </td> <td> My text 1 </td> </tr> <tr style="page-break-inside: avoid"> <td> <img width="100" height="100" src="img2.jpg"> </td> <td> My text 2 </td> </tr> </table>