Skip to main content
Answered

Email template buttons look good in browser but not in app

  • June 15, 2022
  • 1 reply
  • 126 views

Hello everyone ! 

My email template has few buttons. They look great in Desktop browser and mobile browser. But the buttons look full width in mobile email app like Gmail android app.

Why my mobile view style is not working in App? 

 

Thanks

Best answer by Magnus

Hey @user1293​, Magnus from Intercom jumping in here 👋

 

If you're using a Custom Email Template, make sure that you've set it up to be responsive in mobile email clients. You need to include a style tag that contains "data-premailer='ignore'" and include your media queries inside it. Inside your emails <head> tag, you'll have two style tags:

<style type="text/css" data-premailer="ignore">
... Media queries here ...
</style>
 
<style type="text/css">
... Other type of CSS in here
</style>

If you put your media queries in the CSS tag without the "data-premailer='ignore'", it won't respect your responsive media queries CSS.

 

You can read a bit more about it in our Help Center Article here 👈 

 

If this doesn't help, feel free to reach out to us through the Messenger. To set the right expectations of what we're able to do, not that we're not able to help debug any Custom Email Templates - but we can log an issue with our team if you think you've found one.

View original
Did this topic help you find an answer to your question?

1 reply

  • Employee
  • 27 replies
  • Answer
  • June 17, 2022

Hey @user1293​, Magnus from Intercom jumping in here 👋

 

If you're using a Custom Email Template, make sure that you've set it up to be responsive in mobile email clients. You need to include a style tag that contains "data-premailer='ignore'" and include your media queries inside it. Inside your emails <head> tag, you'll have two style tags:

<style type="text/css" data-premailer="ignore">
... Media queries here ...
</style>
 
<style type="text/css">
... Other type of CSS in here
</style>

If you put your media queries in the CSS tag without the "data-premailer='ignore'", it won't respect your responsive media queries CSS.

 

You can read a bit more about it in our Help Center Article here 👈 

 

If this doesn't help, feel free to reach out to us through the Messenger. To set the right expectations of what we're able to do, not that we're not able to help debug any Custom Email Templates - but we can log an issue with our team if you think you've found one.


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings