0

I'm creating our company email signature in HTML.

I realize that the signature will not look 100% identical on every email client (that's an understatement), but my current signature looks pretty stable now.

One thing keeps bothering me though: when the signature is viewed from a live.com or outlook.com email account, then I always see extra white space below every paragraph <p>-tag.

Outlook.com does this intentionally: when I remove the use of paragraph-tags and put my CSS info in the span style, outlook.com still adds a paragraph-tag. So the white space effect is always there.

The effect is that my signature is completely strechted vertically, since there are afew of those paragraphs. I can't limit myself to just one, because my signature's layout is structured with tables.

I really can't find how to avoid this. Can anyone please tell me if it's possible at all to remove this extra white space?

This is some example code: one row of the table that contains one cell with a paragraph and span. So removing the paragraph does not help since outlook.com adds it again by itself:

<tr>
    <td width="10" height="30" style="background-color:#009bd7;line-height:17px;height:30px;">            <!-- --></td>
    <td width="10" height="30" style="font-size:3px; line-height:17px;height:30px;">            <!-- --></td>
    <td width="360" height="30" align="left" style="border-bottom-style:solid;border-bottom-color:#aaaaaa;border-bottom-width:1px;line-height:17px;height:30px;">
       <p style="font-family:Arial;margin:0px;margin-bottom:0px;margin-top:0px;padding:0px;padding-bottom:0px;padding-top:0px;"><span style="font-family:Arial; COLOR:#009bd7; FONT-SIZE: 8pt;margin:0px;padding:0px;margin-bottom:0px;margin-top:0px;height:30px;"><strong>Visit us at WOTS 2014 in Utrecht from 30/9/14 till 3/10/14.<br /><a style="COLOR: #009bd7; TEXT-DECORATION: none" href="https://link">Click here</a> for a free entrance ticket.</strong></span></p>
    </td>
</tr>

This is the effect, left viewed in Outlook 2010 (which is fine), right viewed on Outlook.com or Live.com. (Click to magnify.)

effect

Improve this question
4
  • How are you creating this? In what client? What browsers do you see the extra space in? Have you tried <br> instead? Are you closing </p>?
    – Raystafarian
    Oct 3, 2014 at 8:25
  • The signature is added to our mail by CodeTwo software, but that doesn't really matter. I create the signature in HTML by hand in Notapad++. Browsers are irrelevant, I'm talking about email clients (big difference). Using <BR> or not is irrelevant: the problem lies in the <p> tag which can't be avoided afaik (and yes I'm closing it). Thanks though.
    – SonOfGrey
    Oct 3, 2014 at 8:28
  • Would it be possible for you to add in the HTML code and possibly the CSS so we can see it, but put in dummy info so you are not posting personal information? Make sure you use the "Code Sample" feature when posting that into your questions for ease of reading. Also, don't be deterred if this question is moved to the programming stack exchange site or stack overflow. I'm not 100% sure, but you may get better answers there. We will move it if it needs to be moved though.
    – David
    Oct 3, 2014 at 8:28
  • Example code added...
    – SonOfGrey
    Oct 3, 2014 at 8:41

0

Reset to default

You must log in to answer this question.

Browse other questions tagged .