DN
4
iOS 11 Rendering my Email 1/2 the Width of the Screen
So my email renders fine in all browsers and devices BUT iphone 7 on IOS 11 - The email is only 1/2 the screen size and i'm sumped on what to do next.
Has anyone else run into this issue?
I'm all for ideas...
I've heard of this issue on Slack but haven't been able to reproduce it myself. Would you mind sharing your code so I can take a look ?
As for a fix, you might try the
<meta name="x-apple-disable-message-reformatting" />introduced in iOS 10 (see this). Put it in the<head>of your email and that should do the trick.Thank you! That worked for me.
Thank you! That worked for me.
Also I have issue in Android chrome browser , I was trying to test the template design in gmail using an Android chrome browser, But responsive design are not supported.
Could you please help on this?
Thank you! I was having the same issue and this resolved it.
10,000 claps for you! You've just save my ass.
Same problem here and that fix worked for me, thank you!
Thanks a ton! I thought I tried that but I just tried again and it worked. :)
How to check that meta tag added or not?
Had the same issue. Worked perfectly! Thank you.
PERFECT! Thanks so much, works like a charm! Don't forget to put padding:0; into your <body> tag!
I have tried this, but I am still experiencing this issue on iOS 11 Mail App on the iPhone 7 Plus.
Any other suggestions to help this issue?
Still experiencing the same issue with iPhone 7 Outlook iOS 11
I ran into this problem today and thought it was solved with the
<meta name="x-apple-disable-message-reformating" />, but it was working. Turns out that the code snippet I had copied had curly quotes vs straight quotes.<meta name="x-apple-disable-message-reformating" />vs<meta name=”x-apple-disable-message-reformatting”>I will never get that hour of my life back.
Also:
reformatingvs.reformattingIs anyone seeing this same issue in the Outlook, iPhone 7, iOS 11? This meta change fixes things on other iOS 11 mail programs, but not Outlook.
Have you found a solution to this problem? I'm still searching!
Same issue and have tried everything and still struggling with this, any solution? :P
Oddly I have not experienced this issue in my own work until today. It seems related to the use of Google Fonts. See this article: https://litmus.com/community/discussions/6865-ios11-makes-strange-not-100-width-in-native-mail-app
It I remove the @import Google Font, it renders correctly. Otherwise is does not. Rasmus Bidstrup reports using @font-face instead avoids the issue.
Same here. Still experiencing the same issue with iPhone 7 Outlook iOS 11
Mornin,
thats wierd I did not know that Outlook changed something in the app, anyway U can maybe try to use this one to force outlook app to render in edge:
Let me Know it it worked
@LaurenYoia - Removing the google font snippet (@import... ...) SOLVED it for me. Thanks for the pro-tip.
Hi Stephen, I have a similar issue. My email render fine in all browsers and devices BUT iphone 8 on iOS 11, I have a right padding of 20px. Any thoughts?
Actually I tried <meta name="x-apple-disable-message-reformatting" /> and that solved the issue, thanks!
Nice! Glad you figured it out!
Hi, I don't know why my emails are auto scalling if I use external css, Does anybody knows what happened with it or why my stacking tables do not work in IOS 11? for stacking we use a td with a class we set the following proporties width: 360px !important; display: table !important; margin: 0 auto !important; it allows us to make an stacking tables from the tds
I'm having a similar issue, but only on iPhone 6s and iPhone 6s Plus. It renders fine on all other iPhones.
When I tried adding the <meta name="x-apple-disable-message-reformatting" />, this made all of the iPhone viewports render at 1/2 the width of the screen. Any ideas?
Thanks!
I am facing the similar issue while doing Litmus testing...
Can you confirm, if the shrinking issues in other iphones get resolved after adding “padding:0” ?
Did you put padding:0; into your <body> tag? Try it.
SOLVED: If you have google font import remove that snippet and it will render in ios email native app properly.
You don't need to do that, I am using Google fonts and fixed the issue months ago by:
1. Put padding:0; into your <body> tag
2. Put <meta name="x-apple-disable-message-reformatting" /> in the head of your email