问题
I'm trying to code an HTML email newsletter by hand (using MailChimp). It's supposed to look similar to viastedebouw.nl/newsflash/2013-06/ which was created with an app (and therefore does not have very nice looking code).
The problem that I'm having is that one of the table cells has a width set in HTML and CSS, but it does not correspond to either. The code is:
HTML
<td width="140" class="logo">
CSS
.logo { width: 140px; height: 140px; }
However, what ends up happening is that the logo td is 614px wide, for some reason, as illustrated by this screenshot:
The full code for the email can be found here: https://gist.github.com/Flobin/5849501
Edit: I'm now realizing I got the entire table wrong in the first place, d'oh! Most rows have 1 cell, but some have 2. I forgot to add colspan="2" to the cells that span the entire width of the table.
回答1:
You need to put colspan="2" in each cell if it is in a row by itself. As you have a row with 2 cells, all rows need to add up to 2.
Also, at the very top of your table you should also put an empty row with 2 cells to enforce the desired widths in Outlook. See this technique for more info
回答2:
You cannot apply stylesheets to HTML newsletters, it needs to be inline styles!
This:
<td width="140" class="logo">
Needs to be this:
<td width="140"><img src="http://yourdomain.com/images/logo.png" width="140px" height="140px" /></td>
Or:
<td width="140"><img src="http://yourdomain.com/images/logo.png" style="width:140px;height:140px;" /></td>
Read this thoroughly, to help you in future http://www.sitepoint.com/code-html-email-newsletters/
Edit
I see the inline styles!
It looks like the table width's need to be defined in order for the td's to pick up the maximum width etc.
来源：https://stackoverflow.com/questions/17274903/table-cell-width-in-html-email-does-not-correspond-to-width-set-in-html-or-css