首页 > 解决方案 > 响应式媒体在 Gmail 的电子邮件模板中不起作用

问题描述

我已经到处寻找答案。我正在使用 Mailchimp 撰写电子邮件活动。我有一些带有移动样式媒体查询的自定义 CSS。问题是 Gmail 无法识别媒体查询。其他移动电子邮件客户端是,但 Gmail 不是。

我已联系 Mailchimp 支持,但没有收到任何指导。我查看了 StackOverflow 和其他文章,并尝试实现共享的想法。我没有运气。

任何帮助表示赞赏。谢谢

这是我的电子邮件的 CSS:

我已经尝试过属性选择器和类,但两者都不起作用。

<style type="text/css">
.top-container img {
    display: inline-block;
    margin-right: 30px;
    }
   .content {
    display: inline-block;
    text-align: left;
    vertical-align: top;
    margin-top: 40px;
    width: 60%;
    }
   .content p {
    text-align: left;
   }
   @media only screen and (max-width:600px) {
    .content {
    width: 100%!important;
    }
    .content p {
    text-align: center;
    }
    .top-container img {
    margin-left: auto;
        margin-right: auto;
        display: block;
    }
   }
</style>

我想通过在移动视图中制作全宽来编写媒体查询以制作一些文本和图像中心。

标签: htmlcsshtml-email

解决方案


@media 屏幕和(最大宽度:767px){}

试试这个为我工作


推荐阅读