BCL easyPDF SDK
easyPDF SDK Usermanual
PDF Creator Programming API  |  Download Free Trial  |  Contact Us to Purchase

CSS-Driven Pagination in IEExtendedPrintJob Method

HTML pages are typically designed for screen viewing, where large content can simply be scrolled. However, when you convert HTML into PDF, the content must be broken into pages.
IEExtendedPrintJob has a built-in paginator, which analyzes the underlying content and automatically finds reasonable locations for page breaks to be inserted. Although this technology avoids images and lines of text from being split in half, you may find a situation when you need more control over the exact page break positions.

IEExtendedPrintJob allows full customization of the page break locations via Cascading Style Sheets (CSS). The simplest way to control the page layout is to insert a forced page break before or after a specific HTML element. A more advanced method involves avoiding page breaks before, after or inside an element. This all can be done using the CSS page-break-before, page-break-after and page-break-inside properties.

page-break-after

This property sets the page breaking behavior after an element. The following values are supported:

auto: Default. Insert page break as necessary.
always: Force the insertion of a page break after an element.
avoid: Prevent a page break immediately after an element.

Example:

<style type="text/css">
h1 { page-break-after: avoid; }
</style>
...
<body>
<h1>Header</h1>
<p>Content stays together with the header</p>

The code above disables all page breaks right after an <h1> tag, which effectively prevents the separation between the caption and the first line of text coming afterwards.
Alternatively, you can use inline styling to achieve the same result for a particular tag only:
<h1 style="page-break-after: avoid">Header</h1>
<p>Content stays together with the header</p>

page-break-before

This property sets the page breaking behavior before an element. The following values are supported:

auto: Default. Insert page break as necessary.
always: Force the insertion of a page break before an element.
avoid: Prevent a page break immediately before an element.

Example:

<h1 style="page-break-before: always">New Chapter</h1>

The code above forces a page break to be inserted right before the chapter header.
Another example:
<style type="text/css">
table { page-break-before: always; }
</style>

The code above sets up a forced page break before every <table> tag.

page-break-inside

This property sets the page breaking behavior inside an element. The following values are supported:
auto: Default. Insert page breaks as necessary.
avoid: Prevent a page break inside an entire element.
Note that Internet Explorer 6 and 7 do not support this CSS style yet, therefore it only works as an inline “style” attribute for the tag.

Example:

<center style="page-break-inside: avoid">
<img src="figure1.jpg">
<br>
<i>Figure 1</i>
</center>

In the above example page breaks are disabled inside the entire <center> tag, which means the image and its caption are kept together on the same page.