问题
I have a long table data, which having many of the rows and nested tables. When I am printing this data then the rows of the table and nested tables are just break on the page break, means tables and data are split into pages, So I use following CSS property there:-
table tr {
page-break-inside:avoid;
position:relative;
}
But this is not working in my case, you can see the live demo here:--http://jsfiddle.net/npsingh/S8vr8/2/show/
Please edit the code by following link:--
http://jsfiddle.net/npsingh/S8vr8/2/
---[For Print the page just press [CTRL+P] or right click and click on Print option]---
I am using Google Chrome Version 29.0.1547.66 m
Please let me know where the problem exactly. Thanks
回答1:
Instead of putting the page-break-inside:avoid;
on you table's tr, try applying it on the table directly like this:
table {
page-break-inside:avoid;
position:relative;
}
also add this media query:
@media print {
table {
page-break-inside:avoid;
position:relative;
}
}
回答2:
This did the trick for me it turned out to be the body css:
body{
height: auto!important;
float: none!important;
}
来源:https://stackoverflow.com/questions/18860923/page-break-inside-property-is-not-working-in-chrome