0

I am having an issue with how an email signature I created for a client is displaying in Gmail. It works and looks as intended in Outlook but when it goes to Gmail it gets spaced out by padding that is added by Gmail I am guessing.

Here is how it should look and how it looks in Outlook:

Here is how it should look and how it looks in outlook.

This is what is looks like in Gmail:

This is what is looks like in Gmail.

Here is the code:

<table style="width: 430px; font-size: 9pt; font-family: Arial,sans-serif; line-height:normal;" cellpadding="0" cellspacing="0" class="ng-scope">
<tbody>
 <tr>   
  <!-- ngIf: showField('logo') --><td ng-if="showField('logo')" style="height: 100; width:100px; vertical-align:top;" valign="top" class="ng-scope">
   <!-- ngIf: showField('logoURL') --><a ng-if="showField('logoURL')" href="http://www.councilofmls.org/" target="_blank" class="ng-scope"><img border="0" alt="Logo" height="100" width="100" style="width:100px; height:100px; border:0;" ng-src="http://cmls2018.com/wp-content/uploads/2019/02/CMLS_Email-Signature_logo.jpg" src="http://cmls2018.com/wp-content/uploads/2019/02/CMLS_Email-Signature_logo.jpg"></a><!-- end ngIf: showField('logoURL') -->
   <!-- ngIf: !showField('logoURL') -->
  </td><!-- end ngIf: showField('logo') -->
  <!-- ngIf: !showField('logo') -->

  <td style="width:300px; vertical-align:top;" valign="top">
   <table cellpadding="0" cellspacing="0">
   <tbody>
    <tr>
     <td style="font-size:11pt; font-family: Arial, sans-serif; font-weight: bold; color: #3d3c3f; padding-bottom:5px;"><span style="font-family: Arial, sans-serif; color:#231f20;" class="ng-binding">Kelly Calley</span></td>
    </tr>
    <!-- ngIf: showField('title') --><tr ng-if="showField('title')" class="ng-scope">
     <td style="font-size:10pt; font-family: Arial,sans-serif; font-weight: bold; color: #3d3c3f; padding-bottom:5px;"><span style="font-style: italic; font-family: Arial, sans-serif; color:#231f20;" class="ng-binding">Operations</span></br><span style="font-family: Arial, sans-serif; color:#808285;" class="ng-binding">Council of Multiple Listing Services</span></td>

    </tr><!-- end ngIf: showField('title') -->
    <!-- ngIf: isAnyFieldEntered('phone,mobile') --><tr ng-if="isAnyFieldEntered('phone,mobile')" class="ng-scope">
     <td style="font-size:9pt; font-family: Arial, sans-serif; color: #9b9b9b; padding-bottom:1px;"><!-- ngIf: showField('phone') --><span ng-if="showField('phone')" style="font-family: Arial, sans-serif; color:#808285;" class="ng-binding ng-scope"><span style="color:#231f20; font-weight:bold;">t: </span>727-304-3020</span><!-- end ngIf: showField('phone') --><!-- ngIf: isEveryFieldEntered('phone,mobile') --><span ng-if="isEveryFieldEntered('phone,mobile')" style="font-family: Arial, sans-serif; color:#808285" class="ng-scope"> | </span><!-- end ngIf: isEveryFieldEntered('phone,mobile') --><!-- ngIf: showField('mobile') --><span ng-if="showField('mobile')" style="font-family: Arial, sans-serif; color:#808285" class="ng-binding ng-scope"><span style="color:#231f20; font-weight:bold;">m: </span>727-249-4939</span><!-- end ngIf: showField('mobile') -->
     </td>
    </tr><!-- end ngIf: isAnyFieldEntered('phone,mobile') -->               
    <!-- ngIf: isAnyFieldEntered('email,website') --><tr ng-if="isAnyFieldEntered('email,website')" class="ng-scope">
     <td style="font-size:9pt; font-family: Arial, sans-serif; color: #9b9b9b; padding-bottom:1px;"><!-- ngIf: showField('email') --><span ng-if="showField('email')" style="font-family: Arial, sans-serif; color:#808285;" class="ng-binding ng-scope"><span style="color:#231f20; font-weight:bold;">e: </span>kelly.calley@councilofmls.org</span><!-- end ngIf: showField('email') --><!-- ngIf: isEveryFieldEntered('email,website') --><span ng-if="isEveryFieldEntered('email,website')" style="font-family: Arial, sans-serif; color:#808285" class="ng-scope"> | </span><!-- end ngIf: isEveryFieldEntered('email,website') -->
     <!-- ngIf: showField('website') --><span ng-if="showField('website')" class="ng-scope"><a href="http://CouncilofMLS.org" target="_blank"><!-- ngIf: showField('website') --><span style="color:#231f20; font-weight:bold;">w: </span><span ng-if="showField('website')" style="font-family: Arial, sans-serif; color:#808285" class="ng-binding ng-scope">CMLS.org</span><!-- end ngIf: showField('website') --></a></span><!-- end ngIf: showField('website') -->
     </td>
    </tr><!-- end ngIf: isAnyFieldEntered('email,website') -->              
    <!-- ngIf: isAnyFieldEntered('address1,address2') --><tr ng-if="isAnyFieldEntered('address1,address2')" class="ng-scope">
     <td style="font-size:9pt; font-family: Arial, sans-serif; color: #9b9b9b; padding-bottom:1px;"><!-- ngIf: showField('address1') --><span style="color:#231f20; font-weight:bold;">a: </span><span ng-if="showField('address1')" style="font-family: Arial, sans-serif; color:#808285;" class="ng-binding ng-scope">1000 N. Green Valley Pkwy, #440-583</br>Henderson, NV 89074</span><!-- end ngIf: showField('address1') --><!-- ngIf: isEveryFieldEntered('address1,address2') --><!-- ngIf: showField('address2') -->
     </td>
    </tr><!-- end ngIf: isAnyFieldEntered('address1,address2') -->              
    <!-- ngIf: isAnyFieldEntered('facebookURL,linkedinURL,twitterURL,gplusURL,youtubeURL,instagramURL') --><tr ng-if="isAnyFieldEntered('facebookURL,linkedinURL,twitterURL,gplusURL,youtubeURL,instagramURL')" class="ng-scope">
     <td style="height:20px; padding-top:7px; vertical-align: bottom;"><span style="display:inline-block; height:22px;"><!-- ngIf: showField('facebookURL') --><span ng-if="showField('facebookURL')" class="ng-scope"><a href="https://www.facebook.com/councilofmls/" target="_blank"><img alt="Facebook icon" border="0" width="20" height="20" style="border:0; height:20px; width:20px" ng-src="http://cmls2018.com/wp-content/uploads/2019/02/CMLS_Email-Signature_facebook.jpg" src="http://cmls2018.com/wp-content/uploads/2019/02/CMLS_Email-Signature_facebook.jpg"></a>&nbsp;</span><!-- end ngIf: showField('facebookURL') --><!-- ngIf: showField('linkedinURL') --><!-- ngIf: showField('twitterURL') --><span ng-if="showField('twitterURL')" class="ng-scope"><a href="https://twitter.com/councilofmls" target="_blank"><img alt="Twitter icon" border="0" width="20" height="20" style="border:0; height:20px; width:20px" ng-src="http://cmls2018.com/wp-content/uploads/2019/02/CMLS_Email-Signature_twitter.jpg" src="http://cmls2018.com/wp-content/uploads/2019/02/CMLS_Email-Signature_twitter.jpg"></a>&nbsp;</span><!-- end ngIf: showField('twitterURL') --><!-- ngIf: showField('gplusURL') --><!-- ngIf: showField('youtubeURL') --><!-- ngIf: showField('instagramURL') --></span>
     </td>
    </tr><!-- end ngIf: isAnyFieldEntered('facebookURL,linkedinURL,twitterURL,gplusURL,youtubeURL,instagramURL') -->
   </tbody>
   </table>
  </td>
 </tr>
 <!-- ngIf: showField('banner') --> 
</tbody>
</table>

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Browse other questions tagged or ask your own question.