I use cfdocument and I need to remove bottom-padding from my table.
<cfdocument format="pdf">
<!DOCTYPE html>
<html>
<head>
<style>
table {
font-family: arial, sans-serif;
border-collapse: collapse;
width: 100%;
}
</style>
</head>
<body>
<h2>HTML Table</h2>
<table bgcolor="red">
<tr>
<th>Company</th>
<th>Contact</th>
<th>Country</th>
</tr>
<tr>
<td>Alfreds Futterkiste</td>
<td>Maria Anders</td>
<td>Germany</td>
</tr>
<tr>
<td>Centro comercial Moctezuma</td>
<td>Francisco Chang</td>
<td>Mexico</td>
</tr>
<tr>
<td>Ernst Handel</td>
<td>Roland Mendel</td>
<td>Austria</td>
</tr>
<tr>
<td>Island Trading</td>
<td>Helen Bennett</td>
<td>UK</td>
</tr>
<tr>
<td>Laughing Bacchus Winecellars</td>
<td>Yoshi Tannamuri</td>
<td>Canada</td>
</tr>
<tr>
<td style="padding-bottom: 0px;" cellspacing="0">Magazzini Alimentari Riuniti</td>
<td style="padding-bottom: 0px;" cellspacing="0">Giovanni Rovelli</td>
<td style="padding-bottom: 0px;" cellspacing="0">Italy</td>
</tr>
</table>
</body>
</html>
</cfdocument>
I need to remove the bottom padding (yellow vertical line)
I use padding-bottom: 0px; but didn't worked. There is cellspacing="0" but it will affect entire table.
cffiddle : https://cffiddle.org/app/file?filepath=7b8c6141-8bac-42f5-a653-71ddce64c554/fe42c362-17cb-4810-b532-64e11d98685a/c885261b-341d-4ea2-b6d8-3c55687094ec.cfm
Related
Overview:
I'm trying to get 2 tables to be aligned side by side. In another thread I found out that you can do that using display:inline-table or float: left. However when I added these elements to my CSS, nothing happens.
Here is how my code looks at the moment (also, apologies if my code is messy):
<html>
<head>
<meta charset="utf-8">
<style>
body {
background-color:#FFFFFF;
}
table {
float: left;
font-family: tahoma, sans-serif;
border-collapse: collapse;
width: 100%;
}
td, th {
border: 0px solid #dddddd;
text-align: left;
padding: 8px;
}
tr:nth-child(even) {
background-color: #dddddd;
}
tr:hover {background-color:#FFDB80;}
</style>
</head>
<body>
<table cellpadding="10" cellspacing="0" style="height: 100px; font-family:tahoma;">
<tbody>
<tr>
<td colspan="3" width="700px" valign="center" bgcolor="#192A34" style="color:white;"><font size="4">LIST OF ISBT 128 STANDARDS</font></td>
<td width="100px" valign="center" bgcolor="#192A34" style="color:white;"><font size="2"> 05 Nov 2018</font></td>
</tr>
<tr>
<td width="100px" valign="center" bgcolor="#941A1D" style="color:white;"><font size="2">Identification</font></td>
<td width="600" valign="center" bgcolor="#941A1D" style="color:white;"><font size="2">Document Title</font></td>
<td width="100" valign="center" bgcolor="#941A1D" style="color:white;"><font size="2">Active Version</font></td>
<td valign="center" bgcolor="#941A1D" style="color:white;"><font size="2">Date Issued</font></td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td><font size="2">ST-001</font></td>
<td><font size="2">ISBT 128 Standard Technical Specification</font></td>
<td><font size="2">5.10.0</font></td>
<td><font size="2"> Jan 2019</font></td>
</tr>
</tbody>
</table>
<table cellpadding="10" cellspacing="0" style="height: 100px; font-family:tahoma;">
<tbody>
<tr>
<td colspan="3" width="700px" valign="center" bgcolor="#192A34" style="color:white;"><font size="4">LIST OF ISBT 128 TECHNICAL BULLETINS</font></td>
<td width="100px" valign="center" bgcolor="#192A34" style="color:white;"><font size="2"> 05 Nov 2018</font></td>
</tr>
<tr>
<td width="100px" valign="center" bgcolor="#941A1D" style="color:white;"><font size="2">Identification</font></td>
<td width="600" valign="center" bgcolor="#941A1D" style="color:white;"><font size="2">Document Title</font></td>
<td width="100" valign="center" bgcolor="#941A1D" style="color:white;"><font size="2">Active Version</font></td>
<td valign="center" bgcolor="#941A1D" style="color:white;"><font size="2">Date Issued</font></td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td><font size="2">TB-001</font></td>
<td><font size="2">Implementing ISBT 128: Guidance on Handling non-ISBT 128 Labeled Collections</font></td>
<td><font size="2">5.10.0</font></td>
<td><font size="2"> Jan 2019</font></td>
</tr>
</tbody>
</table>
</body>
</html>
I suspect it has something to do with a lot of the td width elements and other html elements I injected into the table. I'm still a beginner so any suggestions are welcome to clean up the code.
You have your width set on the tables as 100% so each of them is taking up the full width of the browser and they can't fit side by side. Reduce that to 50% and you'll see that works.
Note: <font>, valign and bgcolor have been obsolete for many years. Do not use them.
I am trying to select an element in the prompt, but I am unable to switch control to the prompt.
I've tried the below code:
Alert a = driver.switchTo().alert();
WebElement e = wait.until(Expected Conditions.visibilityofElementLocated(By.xpath("locator"));
Adding HTML code
<table role="dialog" aria-labelledby="ariaLabelledBy_promptsDlg" oncontextmenu="_CWprompts.eventCancelBubble(event);return false" border="0" cellspacing="0" cellpadding="0" id="promptsDlg" style="display: block; padding: 0px; visibility: visible; position: absolute; top: 119px; left: 368px; width: 800px; height: 400px; z-index: 1005;">
<tbody>
<tr>
<td style="width:800px;height:400px;" class="dialogbox" id="td_dialog_promptsDlg" onresize="_CWprompts.DialogBoxWidget_resizeIframeCB('promptsDlg',this)" valign="top">
<table class="dlgBox2" width="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td height="0" valign="top">
<table style="height:26" class="dlgTitle" width="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr valign="top" style="height:26px">
<td onselectstart="return false" ondragstart="return false" onmousedown="_CWprompts.DialogBoxWidget_down(event,'promptsDlg',this,false);return false;" style="cursor:move;padding-left:10px;" width="100%" valign="middle" align="left">
<nobr>
<span id="ariaLabelledBy_promptsDlg" class="titlezone">Prompts</span>
</nobr>
</td>
<td class="dlgCloseArea" align="left" valign="middle">
<table border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr style="height:26px">
<td valign="middle" align="left" style="padding-right:4px;">
<div id="helpIcon_promptsDlg" "="" title="Help Contents" class="imo" style="width:16px;height:16px;background-image:url('images/main/galleries/icon16x16gallery1b.png');background-position:0px -480px;"></div>
</td>
<td style="padding-right:10px">
<div id="dialogClose_promptsDlg" class="dlgCloseBtn" title="Close window"></div>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
I am getting no such alert exception. Can someone please help me out with this?
Thanks in advance.
I want to make the table transparent and I want to see the background image through the table list which is striped with different colors.
I have tried the following but it didn't work.
<style> #loading {
position: absolute; width: 100%; height: 100%; background: url('http://www.jettools.com/images/animated_spinner.gif') no-repeat center center;
}
</style>
<div id="loading"></div>
<table style="background: transparent !important;">
<thead>
<th></th><th></th><th></th><th></th>
</thead>
<tbody style="background: transparent !important;" >
<tr>
<td title="">
</td>
<td title=""
</td>
<td title="">
</td>
<td title="">
</td>
</tr>
</tfoot> </tfoot>
</tbody>
</table>
I've been reading and researching how to build a responsive email - the thing is I am building it using a table. I know tables are not responsive by nature; however, I've been reading up on responsive design, media queries, and such and I still cannot find a solution. Below is what I have so far. Any help would be greatly appreciated as I would like to learn how to make an email responsive.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Trident Email</title>
<style type="text/css">
#media (max-width: 480px){
table,tbody,tr,td,img {
display:block;
}
div#background {
width: 400px;
}
table#container{
width:300px;
}
}
</style>
</head>
<body>
<div id="background" style="background-color:#eeee00;padding:10px 0;margin:0 320px;">
<table style="margin:0px auto;border-spacing:0px;border-collapse:collapse;text-align:center;" cellpadding="0" cellspacing="0" width="600" align="center">
<tbody>
<tr>
<td>
<table id="container" style="border-spacing:0px;border-collapse:collapse;" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td>
<img src="http://enews.trident.edu/hs-fs/hub/336281/file-2384384346-jpg/Headers_Footers/Trident_is_Coming_to_Town.jpg?t=1446144504152" width="100%" style="vertical-align:bottom;">
</td>
</tr>
<tr>
<td>
<table style="border-spacing;0px;border-collapse:collapse;background-color:rgb(0,39,77);" cellpadding="5" cellspacing="0" width="100%">
<tbody>
<tr>
<td></td>
<tr>
<td style="text-align:left;" width="65%">
<table cellpadding="5" cellspacing="10" width="100%">
<tbody>
<tr>
<td>
<div style="">
<p><span style="color: #9c800d; font-family: helvetica;text-transform:uppercase;"><strong>Date:</strong></span></p>
</div>
</td>
<td width="100%" style="text-align:left;">
<div style="">
<p>
<span style="color: #9c800d; font-family: helvetica;"><strong>November 2, 2015</strong></span>
</p>
</div>
</td>
</tr>
<tr>
<td>
<div style="">
<p>
<span style="color: #9c800d; font-family: helvetica;text-transform:uppercase;"><strong>time:</strong></span>
</p>
</div>
</td>
<td width="100%" style="text-align:left;">
<div style="">
<p>
<span style="color: #9c800d; font-family: helvetica;"><strong>10:00AM - 2:00PM</strong></span>
</p>
</div>
</td>
</tr>
<tr>
<td>
<div style="">
<p>
<span style="color: #9c800d; font-family: helvetica;text-transform:uppercase;"><strong>location:</strong></span>
</p>
</div>
</td>
<td width="100%" style="text-align:left;">
<div style="">
<p>
<span style="color: #9c800d; font-family: helvetica;line-height:1.5;"><strong>Fort Rucker Army Installation<br/>Bldg.4502, Room 303</strong></span>
</p>
</div>
</td>
</tr>
</tbody>
</table>
</td>
<td width="35%" style="text-align:right;">
<div>
<img src="http://enews.trident.edu/hs-fs/hub/336281/file-2668017528-jpg/images/Outreach/James_Shiver_175px.jpg?t=1446144504152" width="100%">
</div>
<p style="text-align:left;" color="#ffffff" align="left"><span style="font-family: helvetica; color: #ffffff;" color="#ffffff"><strong>James Shiver</strong></span><br/><span style="font-family: helvetica; font-size: 13px; color: #ffffff;">334-470-9146</span><br><span style="color: #ffffff;">james.shiver#trident.edu</span></p>
</td>
</tr>
</tbody>
</table>
<table style="border-spacing;0px;border-collapse:collapse;background-color:rgb(0,39,77);" cellpadding="5" cellspacing="0" width="100%">
<tbody>
<tr>
<td width="20"></td>
<td width="80">
<div style="border-top:2px solid #9c800d;width:98%">
<p style="color:#ffffff;text-align:center;font-family:helvetica;font-weight:bold;">
Can't stop by? Visit us Online:
</p>
</div>
</td>
<td width="20"></td>
</tr>
</tbody>
</table>
<table style="border-spacing;0px;border-collapse:collapse;background-color:rgb(0,39,77);text-align:center;" cellpadding="0" cellspacing="0" width="100%" align="center">
<tr>
<td width="20"></td>
<td>
<div>
<p style="text-align:center;color:#ffffff;font-family:helvetica;font-size:14px;">
trident.edu/james
</p>
</div>
</td>
<td width="">
<div>
<p style="text-align:center;color:#ffffff;font-family:helvetica;font-size:14px;">
News and Events
</p>
</div>
</td>
<td>
<div>
<p style="text-align:center;color:#ffffff;font-family:helvetica;font-size:14px;">
University Blog
</p>
</div>
</td>
<td width="20"></td>
</tr>
</table>
<table style="border-spacing;0px;border-collapse:collapse;background-color:rgb(0,39,77);" cellpadding="5" cellspacing="0" width="100%">
<tbody>
<tr>
<td width="20"></td>
<td width="60">
<div>
<p style="color:#ffffff;text-align:center;font-family:helvetica;font-weight:bold;">
Trident University<br/>1212 Plaza Dr.<br/>Cypress, CA 90630
</p>
</div>
</td>
<td width="20"></td>
</tr>
<tr>
<td width="20"></td>
<td width="60">
<div>
<img src="http://enews.trident.edu/hs-fs/hub/336281/file-2102317013-png/outreach_emblem-188px.png?t=1446144504152&width=80&name=outreach_emblem-188px.png" width="80" align="center">
</div>
</td>
<td width="20"></td>
</tr>
<tr>
<td width="20"></td>
<td width="60"><p style="color:#ffffff;font-size:13px">Unsubscribe</p></td>
<td width="20"></td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
You need to include an !important in the media query in the <style> so that it can override the inline styles in the email body. This allows table cells to became full width and stack on small viewports.
Here is a basic example of responsive 2-column email layout using media queries:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!-- META Stuff -->
<!-- CSS Reset -->
<style>
/* Media Queries */
#media screen and (max-width: 600px) {
.email-container {
width: 100% !important;
margin: auto !important;
}
/* What it does: Forces table cells into full-width rows. */
.stack-column {
display: block !important;
width: 100% !important;
max-width: 100% !important;
direction: ltr !important;
}
}
</style>
</head>
<body width="100%" bgcolor="#000000" style="margin: 0; mso-line-height-rule: exactly;">
<center style="width: 100%; background: #000000;">
<!-- Email Body : BEGIN -->
<table role="presentation" cellspacing="0" cellpadding="0" border="0" align="center" width="600" style="margin: auto;" class="email-container">
<!-- 2 Even Columns : BEGIN -->
<tr>
<td bgcolor="#ffffff" align="center" valign="top" style="padding: 10px;">
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
<tr>
<!-- Column : BEGIN -->
<td class="stack-column">
<table role="presentation" cellspacing="0" cellpadding="0" border="0">
<tr>
<td style="font-family: sans-serif; font-size: 15px; line-height: 20px; color: #555555; padding: 0 10px 10px; text-align: left;">
Column 1 Maecenas sed ante pellentesque, posuere leo id, eleifend dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
</td>
</tr>
</table>
</td>
<!-- Column : END -->
<!-- Column : BEGIN -->
<td class="stack-column">
<table role="presentation" cellspacing="0" cellpadding="0" border="0">
<tr>
<td style="font-family: sans-serif; font-size: 15px; line-height: 20px; color: #555555; padding: 0 10px 10px; text-align: left;">
Column 2 Maecenas sed ante pellentesque, posuere leo id, eleifend dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
</td>
</tr>
</table>
</td>
<!-- Column : END -->
</tr>
</table>
</td>
</tr>
<!-- 2 Even Columns : END -->
</table>
</center>
</body>
Full code available here
Anyone who gets back to me on this is an absolute legend. I sincerely hope this is just a matter of being too close to the code and I am not able to see it any more. In most if not all browsers and email clients the code is rendering fine. But in GMAIL, the bottom table is blowing out the left and the content on the right hand side to the the right.
Here is a shot of it on litmus: https://betalondon.litmus.com/pub/dfe0bd6
And here is the full code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>ENO MAGIC FLUTE e-mail</title>
</head>
<body>
<table align="center" bgcolor="#000000" border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" valign="top">
<table width="1030px" cellpadding="0" cellspacing="0" border="0">
<tr>
<td width="140" valign="top" bgcolor="#000000" style="line-height: 0px;">
</td>
<td valign="top" width="600" bgcolor="#000000">
<table cellpadding="0" cellspacing="0" border="0" width="600">
<tr>
<td>
<table height="135" border="0" cellpadding="0" cellspacing="0" >
<tr>
<td valign="middle" border="0">
<img src="http://www.beta-testing.co.uk.php5-23.ord1-1.websitetestlink.com/eno/header2.jpg" alt="logo" width="600" height="283" border="0"/>
</td>
<td valign="bottom" border="0" width="18" height="15" bg-color="#ffffff">
<br/>
<br/>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table width="600" cellpadding="0" cellspacing="0" border="0" bgcolor="#ffffff">
<tr>
<td width="310" valign="top">
<table cellpadding="0" width="300" cellspacing="4" border="0" style="margin-top: 15px; margin-left: 10px;">
<!--Title text--><tr>
<td align="left">
<span style="text-decoration: uppercase; font-family:Helvetica, Arial; font-size:14px; color:#000000; line-height:120%;">MOZART's<br/>
</span>
<span style="text-decoration: uppercase; font-family:Helvetica, Arial; font-size:25px; color:#000000; line-height:150%;"><strong>THE MAGIC FLUTE</strong></span><br/>
<span style="text-decoration: uppercase; font-family:Helvetica, Arial; font-size:14px; color:#000000; line-height:150%;">13 Sep - 18 Oct</span><br/>
</td>
</tr>
<tr>
<!--Body-text--><td align="left">
<span style="font-family:Helvetica, Arial; font-size:14px; color:#000000; line-height:120%;">
You are invited back to witness the adventure, music and emotion of one of Mozart's most stirring operas, your last chance to witness Nicholas Hytner's lavish production.<br/><br/>
Its distinctive characters, Papageno, Pamina, Sarastro and The Queen of the Night, along with magical sets, costumes and fantasy creatures, make this remarkable opera one not to be missed. Catch one of the final ten performances for what's been considered <em>'one of ENO's most magical interpretations'</em> (The Times)<br/><br/>
This time why not share the enjoyment and bring friends and family.
</span>
<br/>
<br/>
<table style="background:#e4e4e4; border: solid 1px #d7d7d7;">
<tr>
<td style="padding: 5px;">
<span style="font-family: arial, helvetica, sans-serif; color:#000000; font-size: 18px;">
Final 10 performances<br/>
Tickets from £19<br/>
Children under 16 half price<br/>
<img src="http://www.beta-testing.co.uk.php5-23.ord1-1.websitetestlink.com/eno/booknow.png" border="0"/>
</span>
</td>
</tr>
</table>
<br/>
</td>
</tr>
</tr>
</table>
<br/><br/>
<br/><br/>
</td>
<td><img src="http://content.high50.com/emails/20012012/images/1x1.gif" width="35" height="5" border="0" /></td>
<td valign="top">
<br/>
<table width="255" cellpadding="0" cellspacing="0" height="100%">
<tr>
<td valign="top" width="280" align="left">
<font style="font-family:arial; font-size:14px; color:#000000; line-height:1.5em; padding-left: 40px; margin-top: 15px;"><strong>BOX OFFICE: </strong></font><br/>
<span style="font-family: arial; color: #ed1c24; font-size: 18px; padding-left: 40px;">020 7845 95300</span><br/>
<span style="font-family: arial; ">
<img src="http://www.beta-testing.co.uk.php5-23.ord1-1.websitetestlink.com/eno/fbook.png" border="0"/>
<img src="http://www.beta-testing.co.uk.php5-23.ord1-1.websitetestlink.com/eno/twitter.png" border="0"/>
<img src="http://www.beta-testing.co.uk.php5-23.ord1-1.websitetestlink.com/eno/youtube.png" border="0"/>
<img src="http://www.beta-testing.co.uk.php5-23.ord1-1.websitetestlink.com/eno/flickr.png" border="0"/>
<img src="http://www.beta-testing.co.uk.php5-23.ord1-1.websitetestlink.com/eno/vimeo.png" border="0"/>
</span>
<br/>
<br/>
<img style="padding-left: 11px;" src="http://www.beta-testing.co.uk.php5-23.ord1-1.websitetestlink.com/eno/listen.png" border="0"/></a>
<br/>
<span style="font-family:Georgia, arial, helvetica, sans-serif; font-size:14px; color:#999999; line-height:1.5em; font-style: italic; padding-left: 40px; float: left; text-decoration: none;">
<img src="http://www.beta-testing.co.uk.php5-23.ord1-1.websitetestlink.com/eno/arrow.png" style="float: left;" align="left" border="0" hspace="3" valign="middle" border="0"/>Overture<br/>
<img src="http://www.beta-testing.co.uk.php5-23.ord1-1.websitetestlink.com/eno/arrow.png" style="float: left;" align="left" border="0" hspace="3" valign="middle" border="0"/>Queen of the Night<br/>
<img src="http://www.beta-testing.co.uk.php5-23.ord1-1.websitetestlink.com/eno/arrow.png" style="float: left;" align="left" border="0" hspace="3" valign="middle" border="0"/>Papagena and Papageno</span>
<br/>
<br/>
<br/>
<br/>
</td>
</tr>
</table>
</td>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table height="" border="0" cellpadding="0" cellspacing="0" bgcolor="#ffffff" width="600">
<tr>
<td valign="top">
<hr style="width: 600px; color:#6493b1; border: dotted 1px;"/>
<a href="mailto:?Subject=Book tickets to see The Magic Flute&body=Shall we go and see this opera together?: You are invited back to witness the adventure, music and emotion of one of Mozart's most stirring operas, your last chance to witness Nicholas Hytner's lavish production. Book here
#[http://www.eno.org/see-whats-on/productions/production-page.php?selected_date=13-09-2012&itemid=2130]#"><img src="http://www.beta-testing.co.uk.php5-23.ord1-1.websitetestlink.com/eno/forward.png" alt="forward this e-mail to a friend" width="" height="" border="0"/></a>
<span style="float: right; font-family: arial;"><strong>FOLLOW US</strong>:
<img src="http://www.beta-testing.co.uk.php5-23.ord1-1.websitetestlink.com/eno/fbook.png" border="0"/>
<img src="http://www.beta-testing.co.uk.php5-23.ord1-1.websitetestlink.com/eno/twitter.png" border="0"/>
<img src="http://www.beta-testing.co.uk.php5-23.ord1-1.websitetestlink.com/eno/youtube.png" border="0"/>
<img src="http://www.beta-testing.co.uk.php5-23.ord1-1.websitetestlink.com/eno/flickr.png" border="0"/>
<img src="http://www.beta-testing.co.uk.php5-23.ord1-1.websitetestlink.com/eno/vimeo.png" border="0"/>
</span>
<br/><br/>
<center><span style="text-align: center; font-family: arial; font-size: 20px;"><strong>ENGLISH NATIONAL OPERA</strong></span><br/><span style="text-align: center; font-family: arial; font-size: 12px;">London Coliseum, 38 St. Martin's Lane, London, WC2N 4ES BOX OFFICE: 020 78459300<br/><br/>
<img src="http://www.beta-testing.co.uk.php5-23.ord1-1.websitetestlink.com/eno/artslottery.png" border="0"/><br/><br/>
ENO is a registered charity in England (no 257210)</span><br/><br/>
<span style="font-family: arial; font-size: 11px;">Photos: GTG/ Yunus Durukan</span> <br/>
<hr style="border:1px dotted; color:#6493b1;"><br/><br/>
Unsubscribe</center>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table height="90" border="0" cellpadding="0" cellspacing="0" width="600" bgcolor="#ffffff">
<tr>
<td valign="top" align="center">
<br /><br />
<br />
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td width="140" valign="top" bgcolor="#000000"></td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
Your HTML is invalid. Use the W3C validator service to check it. Pay special attention to errors like this:
Line 91, Column 37: end tag for "table" omitted, but OMITTAG NO was
specified
For me it worked:
1- Open Firefox with Firebug
2- Go to gmail
3- Click "Compose"
4- Right click on the textfield, and choose "Inspect element with Firebug"
5- Search the following code:
[-] <iframe id=":jo" class="Am Al editable" frameborder="0" style="padding: 0px; height: 569.5px; background-color: white;" tabindex="1">
[-] <html style="background:none transparent;min-width:0;">
[+] <head>
[+] <body id=":jo" class="editable LW-avf" style="min-width:0;" hidefocus="true" g_editable="true">
</html>
</iframe>
6- Select <body> and click Edit button
7- Paste your code between <body> and </body> (not included).
8- Close firebug
9- Send the email.