CSS 媒体查询冲突



我在打印 {} 查询时遇到问题@media。我正在努力使我的作品集在印刷品上看起来不错。链接 http://izzatnadiri.com/

当我尝试打印页面时,内容向右移动。原因是以下代码

@media (min-width:768px) {
#wrapper { padding-left: 400px; }
#sidebar-wrapper { width: 400px; } }

这是指向该CSS文件的链接//izzatnadiri.com/css/simple-sidebar.css

打印

时.css应通过打印覆盖此代码。代码如下

@media print{
#sidebar-wrapper {width: 0px;}
#wrapper {padding-left: 0px !important; -webkit-transition: none !important; }}

这是打印的链接.css//izzatnadiri.com/css/print.css

但是,当我尝试打印页面时,打印查询不会覆盖最小宽度查询。

帮助将不胜感激。

提前谢谢。

您是否尝试过在第一个媒体查询中放置"屏幕"?我的意思是这样的:

@media screen (min-width:768px) {
#wrapper { padding-left: 400px; }
#sidebar-wrapper { width: 400px; } }

最新更新