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 agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.