css - chrome新版打印隐藏部分的打印预览边距

Question

我已经展示了一些显示问题的屏幕截图......

问题:

我正在尝试仅使用表格打印此页面，如图所示带有打开的侧 Pane 我已将该侧 Pane 放入print-hidden并且它是工作到 Google Chrome 46.0.2490.71 版本，但在 @media print css margin 不工作。

目前我的谷歌浏览器版本是 48.0.2564.23

侧边栏页面:

新版本的 chrome 显示边距，如打印预览图像所示，此问题仅在 chrome 浏览器中出现，它在所有其他浏览器中工作正常

侧 Pane 页面打印特权:

没有侧边栏页面:

没有侧 Pane 页面打印权限:

我不明白为什么新版本的 chrome 需要 print-hidden div 的边距...!!

重要的是它不能在 chrome 最新更新中运行，否则它很好。

如果有人在最​​新的 chrome 更新中发现打印问题，请告诉我任何人有解决方案。

如果你有任何问题可以问我的问题。

谢谢...

尝试过:

我尝试给出负的左边距，但在那种情况下所有其他浏览器的打印预览都不正确

GitHub 上的问题:

GitHub Issue

Google Chrome 论坛上的问题:

chrome forum issue

JsFiddle:

fiddle

在 JsFiddle 中，我使用了 css 属性 margin-left 但它在 47 之后的 chrome 最新版本中不起作用它在 Google Chrome 46.0.2490.71 之前的旧版本中工作正常 但在下一次更新中，它是其他浏览器中的大问题，它像往常一样非常顺利地工作......

Answer 1

css 有两个问题。

1) 媒体打印应该在最后2) 您在代码中错误地在显示后添加了一个逗号:无。

@media print{
.hidden-print,
tr.hidden-print,
th.hidden-print,
td.hidden-print{display:none !important},
#main-container {
    margin-left: 0px!important;
}
}

正确的 CSS 应该是:

#sidebar {
    width: 200px!important;
    opacity: 1;
    position: fixed;
}
#main-container {
    margin-left: 200px!important;
}
@media print{
.hidden-print,
tr.hidden-print,
th.hidden-print,
td.hidden-print{display:none !important}
#main-container {
    margin-left: 0px!important;
}
}