I have this table where I need spacing between the cells:
<table cellpadding="0" cellspacing="5px">
<tr>
<td><img src="http://placehold.it/100"/></td>
<td><img src="http://placehold.it/100"/></td>
<td><img src="http://placehold.it/100"/></td>
<td><img src="http://placehold.it/100"/></td>
</tr>
</table>
In Outlook 2007, 2010 and 2013 the spacing isn't correct while in other clients it looks just fine.
Outlook 2007, 2010 and 2013:
Other clients:
How do I fix this?
<table cellpadding="0" cellspacing="5px">
should be
<table cellpadding="0" cellspacing="5">
Related
if I apply conditon class style won't render
<!--[if mso]>
<table border="0" cellspacing="0" cellpadding="0" class="cta-test">
<tr>
<td align="center">
test
</td>
</tr>
</table>
<![endif]-->```
Literally just ran a test with this code and it worked fine.
Three tests.
To replicate your issue
Mimicking your issue but without the conditional code surrounding it, to see if there is any difference
Another inline test for comparative testing.
All rendered as expected.
.cta-test { border:1px solid red; }
<!--[if mso]>
<table border="0" cellspacing="0" cellpadding="0" class="cta-test" style="width:200px;">
<tr>
<td align="center">
test
</td>
</tr>
</table>
<![endif]-->
<table border="0" cellspacing="0" cellpadding="0" class="cta-test" style="width:200px;">
<tr>
<td align="center">
test 2
</td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0" style="border:1px solid blue; width:200px;">
<tr>
<td align="center">
test 3
</td>
</tr>
</table>
The issue could be the specific CSS property you're trying to apply as tables aren't always the best option for applying styles.
What is it you're trying to do with that CTA in Outlook?
Is there any logical way to change the background colour for a table cell in a repeatable region in mailchimp? Here is my code, I don't see any options in mailchimp with the custom template build.
<table width="100%" cellspacing="20" mc:repeatable="product" mc:variant="content1">
<tbody>
<tr>
<td align="center" bgcolor="#ff0000" valign="middle" mc:edit="playlist"><h2>Playlist</h2>
<h3>Check out this playlist!</h3>
<h4>FOLLOW</h4></td>
</tr>
</tbody>
</table>
I came across a similar issue today. Here's a possible solution:
<table width="100%" cellspacing="20" mc:repeatable="product" mc:variant="red">
<tbody>
<tr>
<td align="center" bgcolor="#ff0000" valign="middle" mc:edit="playlist">
<h2>Playlist</h2>
<h3>Check out this playlist!</h3>
<h4>FOLLOW</h4>
</td>
</tr>
</tbody>
</table>
<table width="100%" cellspacing="20" mc:repeatable="product" mc:variant="green">
<tbody>
<tr>
<td align="center" bgcolor="#00ff00" valign="middle" mc:edit="playlist">
<h2>Playlist</h2>
<h3>Check out this playlist!</h3>
<h4>FOLLOW</h4>
</td>
</tr>
</tbody>
</table>
<table width="100%" cellspacing="20" mc:repeatable="product" mc:variant="blue">
<tbody>
<tr>
<td align="center" bgcolor="#0000ff" valign="middle" mc:edit="playlist">
<h2>Playlist</h2>
<h3>Check out this playlist!</h3>
<h4>FOLLOW</h4>
</td>
</tr>
</tbody>
</table>
When you've imported this into your template, create a campaign and on the design page you'll have a dropdown with the different colour options. Make any h2s, h3s etc editable by adding mc:edit.
I have this code:
<table align="center" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="1" height="20" width="658">A</td>
</tr>
<tr>
<td colspan="1" width="658">B</td>
</tr>
</table>
CKEDITOR convert it in
<table align="center" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td colspan="1">A</td>
</tr>
<tr>
<td colspan="1">B</td>
</tr>
</tbody>
</table>
How I can keep height and width?
Some mailers program do not like style attribute in TD element.
SOLVED
I have use the config property config.allowedContent
In the ckeditor, right-click the cell you want to customize. Choose cell and then cell properties. There you can set the desire width and height of the cell.
I using datatable plugin (datatables.net) with code below
How can i click anywhere in datatable to get image id
<table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
<thead>
<tr>
<th></th>
<th>Rendering engine</th>
<th>Browser</th>
<th>Platform(s)</th>
<th>Engine version</th>
<th>CSS grade</th>
</tr>
</thead>
<tbody>
<tr class="gradeX">
<td><img id='1' href='#' src='Images/details_open.png'/></td>
<td>Trident</td>
<td>Internet Explorer 4.0</td>
<td>Win 95+</td>
<td class="center">4</td>
<td class="center">X</td>
</tr>
<tr class="gradeC">
<td><td><img id='2' href='#' src='Images/details_open.png'/></td></td>
<td>Trident</td>
<td>Internet Explorer 5.0</td>
<td>Win 95+</td>
<td class="center">5</td>
<td class="center">C</td>
</tr>
</tbody>
</table>
Thanks very much
I use another way to resolve this problem :
I set hiden colum and use function :fnGetData to get id from this hiden row.
Hello and hopefully thanks for the help.
Honestly I am not very experienced at XPath and I am hoping a guru out there will have a quick answer for me.
I am scraping a web page for data. The defining aspect of the data I want is that it is contained in a row <tr> that has 7 <td> elements. Each <td> element has one of the pieces of data I need to import. I am using the HTML Agility Pack on CodePlex to grab the data, but I can't seem to figure out how to define the query.
Contained in the web page is a section like this:
<table border="0" cellpadding="3" cellspacing="1" width="100%">
<tr class="bgWhite" xmlns:msxsl="urn:schemas-microsoft-com:xslt">
<td class="dataHdrText02" valign="top" width="50" align="center"><nobr>SYMBOL</nobr></td>
<td class="dataHdrText02" valign="top" align="center">PERIOD</td>
<td class="dataHdrText02" valign="top" align="center" width="*">EVENT TITLE</td>
<td class="dataHdrText02" valign="top" align="center">EPS ESTIMATE</td>
<td class="dataHdrText02" valign="top" align="center">EPS ACTUAL</td>
<td class="dataHdrText02" valign="top" align="center">PREV. YEAR ACTUAL</td>
<td class="dataHdrText02" valign="top" align="center"><nobr>DATE/TIME (ET)</nobr></td>
</tr>
<tr class="bgWhite">
<td align="center" width="50"><nobr>CSCO </nobr></td>
<td align="center">Q4 2011</td>
<td align="left" width="*">Q4 2011 CISCO Systems Inc Earnings Release</td>
<td align="center">$ 0.38 </td>
<td align="center">n/a </td>
<td align="center">$ 0.43 </td>
<td align="center"><nobr>10-Aug-11</nobr></td>
</tr>
<tr class="bgWhite">
<td align="center" width="50"><nobr>CSCO </nobr></td>
<td align="center">Q3 2011</td>
<td align="left" width="*">Q3 2011 Cisco Systems Earnings Release</td>
<td align="center">$ 0.37 </td>
<td align="center">$ 0.42 </td>
<td align="center">$ 0.42 </td>
<td align="center"><nobr>11-May-11 AMC</nobr></td>
</tr>
<tr class="bgWhite" xmlns:msxsl="urn:schemas-microsoft-com:xslt">
<td align="center" colspan="7"><img src="/format/cb/images/spacer.gif" width="1" height="4"></td>
</tr>
</table>
My goal is to grab the earnings event data and place it into a database for analysis. My original thought was to grab all <tr> elements with 7 <td> elements then work with that data. Any advice or alternative suggestions would be welcome.
This should do it for you.
//tr[count(td)=7]