
Display: block is back?
So I'm doing some stuff with Intercom and their editor is really wonky for custom HTML emails.
It strips out stuff when you add HTML in editor and adds in something, not sure what exactly, that makes Outlook have extra space between columns.
Naturally, I use tables for multiple column sections, as they had better support for quite some time, ever since that KitKat update on Android.
Since I just can't make that render good on Outlook from Intercom, without screwing it up everywhere else, I tried to go the old td route for multiple columns and use display: block; to make them stack on mobile.
My mobile tests:
Gmail App - all good
My Android client (Boxer) - all good
iOS never had any problems with that, so the 2 main reasons why display: block wasn't as good to use are now no problem.
Anyone using display: block; for column stacking on mobile?
Is it safe to assume that display: block is back and is supported on various mobile clients/devices?
Let me know your thoughts.
Cheers,
Zoran
I've used display:block to stack columns in emails for 5 years now. Never had a problem. The only thing is display:block isn't supported on a <td> in Android 4.4, so instead of using <td> for 2 columns next to eachother, I use <th> and has worked perfectly fine across all email clients, never had an issue :)
Thanks so much for the <th>
Thank you soooo much for the <th> trick.
It helped me for Android 4.4, and also for Outlook app on iOS which had the same problem.
This comment is very helpful. Thank you!
display: block; has been the way to go since Gmail began supporting media queries in 2016ish.