响应式网站和打印样式表问题

Question

我已经为我的网站设置了一个响应式样式表，这里是负责为左侧导航菜单清空一些空间的 CSS 文件的一部分：

@media (min-width: 48em) {
    #layout { padding-left: 150px }
}

我还设置了一个 print.css 文件作为专用打印样式表，如下所示，我将菜单设置为隐藏并且它的空间被省略：

@media print {
    #layout { padding-left:0 }
    #menu { display : none }
}

问题是，在打印预览时，菜单会隐藏，但内容左侧仍有150px的空白，无论如何，我什至尝试过：

    #layout { padding-left:0 !important }

但运气不好，

当我使用 Chrome 的内置功能（检查元素）手动将 padding-left 值更改为 0 时，页面在打印预览中显示正常，但是print.css 中的代码似乎无论如何都没有应用。

Answer 1

经过大量测试后，一切正常。我想通了。 padding-left 问题似乎只发生在 Google Chrome 的打印预览中，因为所有其他浏览器的打印预览都尊重打印 CSS。所以我的 CSS 一切都很好，这是浏览器相关的错误。