Prevent HTML tables from being cut off on new pages

Are your tables being split when trying to print them?

The HTML table starts in one page and follows to the next getting cut?

I had the same problem and luckily I found a solution that works across all browsers (Chrome, Safari, Firefox, IE8, Internet Explorer 11).

Use the page-break property, which is divided in three:

  • page-break-after
  • page-break-before
  • page-break-inside

After trying multiple combinations I’ve found the one that just works:

More information on page-break-inside on MDN.

2 Responses to “Prevent HTML tables from being cut off on new pages”

  1. Gene January 12, 2016 at 10:05 pm #

    Thanks.

  2. Jordan April 19, 2016 at 8:48 pm #

    Great@

Leave a Reply

Add <code> Some Code </code> by using this tags.