Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

avoid page break inside row of table

I want to avoid page break inside row of table in html, when I convert html to PDF by wkhtmltopdf. I use page-break-inside:avoid with table- its works, but I have so many rows, then not work. If set display of tr as block or some thing else then it change the formatting of table and insert double border. Or it is possible to insert the table header on each page, where the table was splitted.

like image 897
Ankit Mittal Avatar asked Feb 15 '12 06:02

Ankit Mittal


People also ask

How do I prevent page breaks within a table row?

Make sure all parent elements are display: block . Also consider overriding table , tr , td 's display styles with CSS grid for the print layout if you keep having issues with the table.

How do I avoid a page-break inside?

The page-break-inside property sets whether a page-break should be avoided inside a specified element. Tip: The properties: page-break-before, page-break-after and page-break-inside help to define how a document should behave when printed. Note: You cannot use this property on absolutely positioned elements.

How do I stop page breaks in HTML?

Syntax: page-break-inside: auto; avoid: It avoids a page break inside the element.


1 Answers

You might try this with CSS:

<table class="print-friendly">  <!-- The rest of your table here --> </table>  <style>     table.print-friendly tr td, table.print-friendly tr th {         page-break-inside: avoid;     } </style> 

Most CSS rules don't apply to <tr> tags directly, because of exactly what you pointed out above - they have a unique display style, which doesn't allow for these CSS rules. However, the <td> and <th> tags within them usually do allow this kind of specification - and you can easily apply such rules to ALL child-<tr>'s and <td>'s using CSS as shown above.

like image 196
Troy Alford Avatar answered Oct 07 '22 20:10

Troy Alford