RF0
Lines displaying where spacer gifs should be in Outlook
I use spacer gifs to create margins for my tables. Everything checked out in Litmus testing, but the client reporte lines where each spacer.gif was placed. She forwarded me the email and I didn't see the lines. She sent me a screenshot which was helpful. A co-worked had the same problem using Outlook 2010 on a Windows PC.
My first impression was that the spacer gifs were not included when the email was sent. But, I didn't see the problem on my Outlook for Mac. In fact, all Litmus testing passed, especially all Outlooks.
I'd be happy to hear suggestions. Thank you!
I'm not pulling up your screenshot so it's hard to know for sure. I've had lines in a few different places related to margins- largely when padding or borders were applied to it's neighboring cells. (So the center cell might have padding-top:20px but if the cells to the left or right don't have that same padding there would be a gap/line. But that always shows up in tests that way too.) Another problem I've come up with, especially on Outlook 2010 is user settings. Some users can set their inboxes to zoom or something similar and that can break some more specific messages (it also kills animated gifs)
I've found it better to forgo the spacer gif altogether and use nested tables where a 650px table holds a centered 550px table with the content/text in it. That gives the space a 50px margin on the left and right without having any silly spacer issues. :)
I hope that works, and good luck!
padding won't work in some email clients. If you really need padding you can use cellpadding on the table.
Thanks Sarah. My next go around I will take that route and lose the spacer gifs.
This new link to the screenshot should work: http://bit.ly/1nGhaxW
I'm going to have to agree with Sarah and say you should drop the spacer gifs. Also, if you could post your code we could see what's going on with these images.
So in the CSS I did a...
That fixed the problem. Outlook 2010 was adding a border to all the spacer gifs. Next time I think I will use Zurb Foundation's Ink framework and no spacer gifs!
Thanks for the help.
Doh! Something so simple.
As a rule of thumb, you should be setting border="0" on all images. Better safe than sorry!