Newsletter Consistency

Posted on 2011-02-17
Last Modified: 2012-05-11
I have an HTML newsletter that I am launching from Vertical Response.  It is displaying properly in Outlook and Yahoo, but in Hotmail and Gmail it creates spacing or padding between table rows.  Does anybody know a workaround to this?  I have tried everything and the extra space doesn't show up in Firefox firebug or the source code.  I am attaching the newsletter.
Question by:kageboy2003
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 2
LVL 83

Expert Comment

by:Dave Baldwin
ID: 34922848
This page shows things that Gmail doesn't support.  The only thing I see right off is the <style> tag which Gmail doesn't support anywhere in the document.

Author Comment

ID: 34926331

Thank you for that valuable information.  After looking through the CSS guide, I can still find no reason that my table rows have spacing in between them in Hotmail and Gmail.  The <style> tag in the body was added after the fact as an attempt to see if padding the tables would eliminate this issue.  I will upload a screenshot so you can see what I am talking about.


Author Comment

ID: 34928015
Here is a screenshot of both outlook 2007 and hotmail views of the newsletter in question.  As you can see from my code that I uploaded in the previous post, There is no reasoning I can see why there is space between the table rows.  Is there another method I am not using?  Maybe applying a height to the tables?  I thought of that, but the breaks are between the table rows and not the tables.
WordPress Tutorial 1: Installation & Setup

WordPress is a very popular option for running your web site and can be used to get your content online quickly for the world to see. This guide will walk you through installing the WordPress server software and the initial setup process.

LVL 83

Expert Comment

by:Dave Baldwin
ID: 34928962
Try adding style="padding:0px; margin:0px;" to all of your images.  Those lines are at the image boundaries and the CSS on Hotmail may be breaking your display.

Accepted Solution

kageboy2003 earned 0 total points
ID: 35305709
After some research, I found out that using style="line-height:-1px;" in all the <td> tags that contain images, and style="display:block;" in all the <img> tags corrects the issue across all browsers.

Author Closing Comment

ID: 35339943
I was offered some really good starting points, but still nothing seemed to fix the issue.  After doing some further research and testing, I found this solution to correct the issue.

Featured Post

Ready to get started with anonymous questions?

It's easy! Check out this step-by-step guide for asking an anonymous question on Experts Exchange.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses how to create an extensible mechanism for linked drop downs.
The article shows the basic steps of integrating an HTML theme template into an ASP.NET MVC project
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…

622 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question