admin管理员组

文章数量:1417555

I'm using Auth0 email template to send emails. I've customized the template with using my own design and I want to make sure that it works for mobile, but the media query isn't working.

Here are my styles:

<style>
      @media (min-width:640px) {          
        .sm_table-cell {
          display: table-cell !important;
        }

        .sm_w-full {
          width: 100% !important;
        }

        .sm_w-1-5 {
          width: 20% !important;
        }

        .sm_w-3-5 {
          width: 60% !important;
        }
      }
      
      @media (max-width:600px) {           
        .content-wrapper{
          border-radius: 0 !important;
          padding-left: 0 !important; 
          padding-right: 0 !important;
        }
      }  

</style>

Table with content-wrapper class:

<table role="presentation" cellpadding="0" cellspacing="0" border="0" width="100%"
style="width: 100% !important; max-width: 500px; background-color: white; border-radius: 20px; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);"
class="content-wrapper">
</table>

I've tested this in Gmail and Yahoo. Yahoo also ignores the linear gradient background I'm applying to the body tag:

<body
    style="margin: 0; padding: 0; min-width: 100%; height: auto; background: linear-gradient(90deg, #E7E6FC, #B6B2F9); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;">

Am I doing anything wrong?

本文标签： htmlMedia query not working in Auth0 email templateStack Overflow

版权声明：本文标题：html - Media query not working in Auth0 email template - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1745270918a2650885.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。