Oh, I actually got it solved today by changing <td> tags to <th> where I have several data elements in one row! But I can't see any pattern or a specific cause, where I could explain why some devices prefer <th>? That would be a more precise question to my previous long comment/question.
Hi Nicole once again :) I have also noticed inconsistencies between Outlook App (both Android and iOS) previews and the actual e-mail. It looks like, that some specific versions of Android (6.0, 5.0) and iPhone 5, iPhone 8 does not support mobile queries (I have sent test mails), or does read CSS styling in some weird way. I have personally Android 7 with Outlook App installed - it works great. My colleague has iPhone 7 - things look also great.
Have you saw or heard anything about it? Outlook App was rolling a lot of updates recently, so I am sure, that there is a combination of phone and app version.
Hi Nicole, this is such a great answer! I was having a theory about this issue, that the previews are not mobile responsive, but we still get some questions from our clients, why it's not mobile optimized... So now I can be 100% that I have the right answer. Thank you!
By the way, play button is a default thingie. Previously GIFs were not supported at all in most of the desktop clients, so at least we have it plaid once now. :D
I had the same problem yesterday. Problem was, that original GIF file was 1280x600px, while e-mail template was 640px, which resulted GIF out of scale 640x600px.
Fix: eksport your GIF in scale 1:1. e.g. 640x300px. This worked for me.
Let me know if this works for you too.
I just found this article: https://www.zdnet.com/article/microsoft-to-drop-outlook-on-the-web-mobile-apps-for-ios-android-by-mid-may/
It kind of makes sense why nothing works when I try to fix things only for Outlook app. Surprisingly mobile queries are working almost perfectly on Android, but it's a disaster on iOS - tons of problems with widths and god knows what.
Another headache - in most of my templates, I have to use floats (my company has some sort of analogical framework as Mailchimp and we have some predefined CSS). My guess is that the damn float blows up a little bit the td and the content inside of it (img and text) - and this happens only in Outlook app.
It really makes me mad. Every single morning I am checking for updates regarding all of this mess.
I'm having the same issue and can't stack content on top of each other in Outlook iOS! I'll be watching your post and if I find any functional solution, I'll definitely share.