如何避免表格在打印预览中损坏？

Question

I know there are many questions and many answers for this. Everyone has different problems with different solutions for different browsers. I have tried many solutions from the below URLs. But nothing seems to work.
My output is as follows : How can I avoid this kind of situation? I don't want to mess up the table structure. This table data are filled up dynamically using handlebars.js.
Links I have followed: Link-1 Link-2 Link-3
.page-break is a div class which I have added after each section and that is working fine.

.Acc_Table is a table class which is shown in output image starting from SEARS/CBSD row and ending with payment history row.
How can I solve this?
Is it possible to close the table before the page break, put in the page break, and reopen the table after the page break? Or what I wish to display the table on the next page only if it's breaking? How can I achieve that?

Answer 1

have you checked if the table or if there is a div that is wrapped around it has the display: inline-block; or display: inline; CSS property? I found out that while I was debugging some code for a printing problem that if the table is inline you get this effect. Try to put display: block or display: static , that works for me