Email service providers are continually tweaking their readers, which can result in differences in the way they present your emails. As email designers, we are used to identifying the issues this can throw up, then incorporating email code fixes to compensate. What’s harder, though, is realising when a fix is no longer needed ….
A case in point – an issue appeared around the end of last year that affected email display in Yahoo! webmail readers: all emails were being aligned to the left of the preview pane regardless of the alignment you set on it. This excellent article by Litmus’s Jason Rodriguez suggested a neat workaround involving adding style=’table-layout:fixed’ to the email’s 100% width containing table (don’t know what I’m talking about? Read here about ‘Stretching background colour fills‘).
Job done – cut forward to today. I noticed when testing a customer’s email that something weird was happening to the background colour fill in narrower iOS devices: it was only stretching to about half the width of the screen. After eliminating other possibilities, I suspected that the problem may have something to do with the style=’table-layout:fixed’ code on the background colour fill table.
With this in mind, I came back to Jason Rodriguez’ original article in to see if anyone else had come across this problem. Looking through the comments I didn’t find any mention of the iOS problem but it did seem that the Yahoo! fix was causing an issue in Gmail. Although I had noticed previously that Gmail test results in my Litmus account were showing a big white space to the right, it hadn’t rung any alarm bells (I thought it was just space reserved for adverts) so I had noted it down ‘to come back to’.
However, what I hadn’t spotted until I reviewed emails in our live Gmail account was that the cropped email had no horizontal scroll bar to view the rest of it! Yikes.
As suggested in the comments, I removed the style=’table-layout:fixed’ and tested in both Litmus and live accounts. Not only was my initial iOS issue fixed, but so was the Gmail issue (we now had a scrollbar!) – and even better, the original Yahoo! alignment problem was no longer there! The fix was no longer needed.
The moral: do keep an eye on the little differences in email display, they may be connected; and watch those ‘fixes’ – something that corrects an issue now could cause an issue later!