Question

我创建了一个客户在购买机票时收到的响应邮件。在同一个文件中，我有两个不同的CSS类：

*[class=noDisplayAtMobile] { display: none !important; display:none; mso-hide:all }

*[class=displayAtMobile] { display: block !important; width:100% !important; max-width:650px !important ; max-height:inherit!important; float:none !important; overflow:visible !important; }

第一个类用于在桌面上显示邮件，第二个类用于显示移动设备上的邮件，当我在原始（全屏）布局中使用第二个类时，我使用跟随样式不在全屏显示

   style="width: 0; max-height: 0; overflow: hidden; float: left;"

当我的浏览器窗口小于650px时我看到响应输出，而当它是全屏时我看到无响应输出，但是在邮件（GMail）我看到它们两个......

有没有人对问题是什么以及我可以做些什么来解决它？

Answer 1

您应该尝试以下代码

.your_class { display: none !important; display:none; mso-hide:all }

@media (max-width: 650px) { //apply css when screen width <=650px
.your_class { display: block !important; width:100% !important; max-width:650px !important ; max-height:inherit!important; float:none !important; overflow:visible !important; }
}

显示器上的响应问题

1 个答案: