Question

I am trying to create a company-wide email signature. Here is the code for it:

<table style="font-family:verdana, arial, sans-serif; color:#7f7f7f; font-size:12px; line-height:15px">
    <tr>
        <td><div style="font-size:145px; color:#69cd37; line-height:0px; position:relative; top:-17px; left:7px; margin-left:-20px">&#9679;</div></td>
        <td>
            <b>firstName lastName, </b><i>title</i><br />
            <b style="color:#69cd37">Company Name</b><br />
            Street, City, State, Zip<br />
            <b>office </b>###.###.#### | <b> mobile</b>###.###.####
        </td>
    </tr>
</table>

When I test this email, it looks great and works fine on most of our HTML enabled emails. The problem lies within "Good for Enterprise" email. Most of the higher-ups use "Good" email on their mobile phones. The signature looks fine and the font sizes are all correct, but it wraps, and it wraps bad.

So to fix it, I've tried everything: table width="500", style="min-width:500px", white-space:nowrap;. These all fix the wrapping problem, but they seem to enlarge the font by double! And there's no explanation to it.

Is there any reason it would be enlarging it? When I send an email with the original version (posted above) and a new version with no wrapping, the original version has correct font size, but the wrapped version's font size is huge. Is the wrapping interacting with the phone screen width?

No correct solution

OTHER TIPS

Put all of your text styling in the <td> tag it is contatined in. In many email clients you have to redeclare in every single <td> that contains text. You don't need it in the <table> tag, just the <td> tags.

If that doesn't work, try -webkit-text-size-adjust:none; -ms-text-size-adjust:none; font-size-adjust:none;, in the <td> inline style, although that may be a long shot (not sure what/how "Good" works).

If you are still out of luck, try and find a way to view the code as it is rendered (after "Good" does it's thing). This may help debug the cause and might possibly reveal a way to prevent it.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top