How to achieve page break in HTML table for Google Chrome?

Question

I am trying to print a large table generated with jQuery in an HTML page. I am using Chrome 26.0.141. The issue is with page break.

i initially used this css

<

Answer 1

As said on MDN:

WebKit browsers doesn't support this property; but some have the non-standard -webkit-column-break-after and -webkit-region-break-after with similar parameters as page-break-after.

So you need to use page-break-after with some value which suits you the best. Here are some of them:

The page-break-after CSS property adjusts page breaks after the current element.

auto: Initial value. Automatic page breaks (neither forced nor forbidden).

always: Always force page breaks after the element.

avoid: Avoid page breaks after the element.

left: Force page breaks after the element so that the next page is formatted as a left page.

right: Force page breaks after the element so that the next page is formatted as a right page.

You can also use the break-after property:

The break-after CSS property describes how the page, column or region break behavior after the generated box. If there is no generated box, the property is ignored.