html - Page-Break-inside 属性在 chrome 中不起作用

Question

我有一个长表数据，其中包含许多行和嵌套表。当我打印这些数据时，表格和嵌套表格的行只是在分页符处中断，这意味着表格和数据被分成页面，所以我在那里使用以下 CSS 属性：-

table tr {
 page-break-inside:avoid;
 position:relative;
 }

但这在我的情况下不起作用，您可以在此处查看现场演示：-- http://jsfiddle.net/npsingh/S8vr8/2/show/

请通过以下链接编辑代码：--
http://jsfiddle.net/npsingh/S8vr8/2/
---[打印页面只需按 [CTRL+P] 或右键单击并单击打印选项]-- -

我正在使用 Google Chrome 版本 29.0.1547.66 m

请让我知道问题究竟出在哪里。谢谢

score 6 · Accepted Answer

不要把它page-break-inside:avoid;放在你桌子的 tr 上，试着像这样直接把它应用到桌子上：

table {
    page-break-inside:avoid;
    position:relative;
}

还添加此媒体查询：

@media print {
   table {
        page-break-inside:avoid;
        position:relative;
    }
}

score 0 · Accepted Answer

这对我有用，结果是身体 css：

body{
    height: auto!important;
    float: none!important;
}

2 回答 2