 |
 |
|
||||||||
|
||||||||
01-23-2012, 07:39 PM
|
#1 |
|
New Member
 Join Date: Jan 2012
Posts: 5
|
Help with coding html email
I designed an html email, and checked it with Gmail, Ymail, and Thunderbird. In all three applications, my background image did not show up, and there was also a 1 pixel gap between the header and content.
I understand that Gmail has little support for background images, but shouldnt the background image show up in Ymail and Thunderbird? Also, what can I do about the 1px gap? I am posting my code here. HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html lang="en"> <head> <meta content="text/html; charset=utf-8" http-equiv="Content-Type"> <title> Reminder 1 </title> </head> <body> <table cellpadding="5" cellspacing="0" align="left" width="98%" style="padding:0, 10px;"><!--container--> <table cellpadding="0" cellspacing="0" border="4px" align="left"><!--wrapper of table- really needs 98% width--> <tr> <td align="left" style="margin: 0; padding: 0;"><!--bg--> <table cellpadding="0" cellspacing="0" border="0" align="center" width="100%" style="font-family: Georgia, serif;"><!--header-had 600 width--> <tr> <td height="110" align="left" width="550"> <img width="576px" height="110px" src="http://www.totalrecallsolutions.com/corporate/email templates/images/southfield_header.jpg" alt="header" /></td> </tr> </table><!-- header--> <table cellpadding="0" cellspacing="0" border="0" align="center" width="100%" style="font-family: Georgia, serif; margin-top:-5px;"><!--both columns-had 600 width--> <tr> <td width="14" bgcolor="#9999cc"background="http://www.totalrecallsolutions.com/corporate/email templates/images/appt_reminder_one_bg.jpg"> <td width="266" bgcolor="#9999cc" background="http://www.totalrecallsolutions.com/corporate/email templates/images/appt_reminder_one_bg.jpg" valign="top" align="left" style="font-family: Georgia, serif;padding-top:12px; padding-right:3px;"> <img width="250px" height="360px" src="http://www.totalrecallsolutions.com/corporate/email templates/images/woman.jpg"alt="Woman smiling" /></td> <td width="24" style="font-size: 0px; font-family: Georgia, serif; background:white;"> </td> <td width="186" valign="top" align="left" style="font-family: Georgia, serif; background: white; padding: 0 0 20px;" > <table cellpadding="0" cellspacing="0" border="0" style="color: black; font: normal 11px Arial, serif; margin:0px; padding-top:0px;"width="100%"><!--right column--> <tr> <td style="padding: 5px 0 0px;" valign="top" align="left"width="252"> <img width="252px" height="72px" alt="reminder" src="http://www.totalrecallsolutions.com/corporate/email templates/images/appt_reminder_one_title.jpg" /></td> </tr> <tr> <td width="186"> <h1>Dear %FirstName%,</h1> </td> </tr> <tr> <td style="font-family:Verdana, Geneva, sans-serif; font-size: 14px; line-height:14px; padding: 18px 0 5px; margin:0; color:black; font-weight: normal; " valign="top" align="left"width="186" > <p>Just a friendly reminder <br />about your appointment with<br /><font style="font-weight:bold"> %PracticeName%</font>, <br />on<font style="font-weight:bold"> %AppointmentDate%</font>. <br/> <br /> We look forward to seeing you then. <br /> Sincerely, <br /> %PracticeName% </p> </td> </tr> <tr> <td width="186"style="line-height: 13px; margin:0; color:black; padding: 50px 0 5px;font-family:Verdana, Geneva, sans-serif; " valign="top" align="left"> <h3> Visit us on the web</h3> <a style="color:black; " href="http://www.southfieldsmile.com">%PracticeUrl%</a> </td> </tr> <tr> <td width="186" style="padding-top:24px; padding-left:-20px;"> <a style=" color:#fff; text-decoration: underline;" href="http://www.facebook.com" target="_blank"><img width="43px" height="43px" alt="facebook" src="http://www.totalrecallsolutions.com/corporate/email templates/images/facebook.gif"/></a> <a style=" color:#fff; text-decoration: underline;" href="http://www.twitter.com" target="_blank"><img width="43px" height="43px" alt="twitter" src="http://www.totalrecallsolutions.com/corporate/email templates/images/twitter.gif" /></a> <a style=" color:#fff; text-decoration: underline;" href="http://www.totalrecallsolutions.com"target="_blank"><img width="43px" height="43px" alt="book appointment" src="http://www.totalrecallsolutions.com/corporate/email templates/images/book_appointment_widget.gif" /></a> <!--<img width="43px" height="43px" alt="refer" src="images/refer_a_friend_widget.gif" />--> <a style=" color:#fff; text-decoration: underline;" href="http://maps.google.com/maps?q=76-32+168+street+fresh+meadows&hl=en&sll=37.0625,-95.677068&sspn=44.47475,106.787109&vpsrc=0&hnear=76-32+168th+St,+Fresh+Meadows,+New+York+11366&t=m&z=16"target="_blank"><img width="43px" height="43px" alt="find" src="http://www.totalrecallsolutions.com/corporate/email templates/images/find_us.gif" /></a></td> </tr> </table> </td> <td width="16" style="font-size: 0px; font-family: Georgia, serif; background: #fff;"> </td> </tr> <table cellpadding="0" cellspacing="0" border="0" style="color: black; font: normal 11px Arial, serif; margin: 0; padding: 0; background:#C9F;" width="100%" bgcolor="#ffffff"><!--footer--> <tr> <td width="500"style="padding-left:60px;"> <p>%PracticeName% |  <a href="mailto:support@totalrecallsolutions.com">%PracticeEmail%</a> |  <a href="classic-updated/classic/html_with_cm_tags/www.totalrecallsolutions.com">www.totalrecallsolutions.com</a> </p> </td> </tr> </table><!--footer--> </table><!-- body --> </td> </tr> </table><!-- wrapper of table--> </table><!--container--> </body> </html> |
|
|
 |
| Thread Tools | |
| Display Modes | |
|
|
Linear Mode
