2012-03-21 20 views
0

このHTMLが電子メールで送信されていますが、一部の受信者はメールクライアントで問題が発生します(私は見通しが疑わしい)。一部の電子メールクライアントでHTMLが正しく表示されない

このHTMLコードを何度もチェックして再チェックしましたが、いくつかの要素が正しい位置にない理由がわかりません。

私は暗赤色の線で "エラー" を強調しました:

buggy mail

HTML:それが動作するため

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<title>'.$mail['subject'].'</title> 
</head> 

<body> 
<table style="border: 0; border-spacing: 0; line-height: 0; margin: 0; padding: 0; width: 559px;"> 
    <tr style="border: 0; margin: 0; padding: 0;"> 
     <td colspan="5" style="border: 0; margin: 0; padding: 0; width: 559px;"><img src="'.$root.$cards['path']['mail'].'0-0-'.$mail['card'].'.jpg" style="border: 0; margin: 0; padding: 0;" alt="" /></td> 
    </tr><tr style="border: 0; margin: 0; padding: 0;"> 
     <td style="border: 0; margin: 0; padding: 0; width: 120px;"><img src="'.$root.$cards['path']['mail'].'1-0.jpg" style="border: 0; margin: 0; padding: 0;" alt="" /></td> 
     <td rowspan="2" style="border: 0; margin: 0; padding: 0; vertical-align: top; width: 210px"><p style="border: 0; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 12px; margin: 0; padding: 0; word-wrap: break-word; width: 210px;">'.$mail['message'].'<br /><br />'.$mail['from_name'].'</p></td> 
     <td colspan="3" style="border: 0; margin: 0; padding: 0; width: 269px;"><img src="'.$root.$cards['path']['mail'].'1-2.jpg" style="border: 0; margin: 0; padding: 0;" alt="" /></td> 
    </tr><tr style="border: 0; margin: 0; padding: 0;"> 
     <td style="border: 0; margin: 0; padding: 0; width: 120px;"><img src="'.$root.$cards['path']['mail'].'2-0.jpg" style="border: 0; margin: 0; padding: 0;" alt="" /></td> 
     <td style="border: 0; margin: 0; padding: 0; width: 65px;"><img src="'.$root.$cards['path']['mail'].'/2-2.jpg" style="border: 0; margin: 0; padding: 0;" alt="" /></td> 
     <td style="border: 0; margin: 0; padding: 0; vertical-align: top; width: 170px;"><p style="border: 0; font-family: Arial, Helvetica, sans-serif; font-size: 12px; margin: 0; line-height: 12px; padding: 0; width: 170px;">'.$mail['to_name'].'</p></td> 
     <td style="border: 0; margin: 0; padding: 0; width: 34px;"><img src="'.$root.$cards['path']['mail'].'2-4.jpg" style="border: 0; margin: 0; padding: 0;" alt="" /></td> 
    </tr><tr style="border: 0; margin: 0; padding: 0;"> 
     <td colspan="5" style="border: 0; margin: 0; padding: 0; width: 559px;"><img src="'.$root.$cards['path']['mail'].'3-0.jpg" style="border: 0; margin: 0; padding: 0;" alt="" /></td> 
    </tr><tr style="border: 0; margin: 0; padding: 0;"> 
     <td colspan="5" style="border: 0; margin: 0; padding: 0; width: 559px;"><p style="border: 0; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 12px; margin: 0; padding: 0; word-wrap: break-word; width: 210px;"><a href="http://www.geschiedeniszeeland.nl" target="_blank"><img src="'.$root.'images/site-button.jpg" style="border: 0; margin: 0; padding: 0;" alt="" /></a></p></td> 
    </tr> 
</table> 
</body> 
</html> 

はHTMLでPHPのビットを心配しないでください魔法のように。

+1

問題が何であれ、それは微妙なものになるでしょう。 PHPコードではなく、HTMLを正確に調べているかどうかを判断するのは簡単でしょう。 – dldnh

答えて

0

まず、imgタグを使用するたびに、style = "display:block"を使用する必要があります。これはイメージの下の1pxの白い線を避けるためです。

第2に、collspan/rowspanではなくtabelでtabelを使用する方が良いです。

テーブルが付いている559pwですが、3行目は120 + 65 + 170 + 34 = 389pxです。また、列が欠落しています。

+0

あなたが言及した行の幅をブロックして固定するように画像を変更しました。ソースコードは自分自身にアップロードしたい(神がなぜそうなっているか)という顧客に戻ってきているので、私は待たなければならない。それが問題を解決したら、私はとても幸せになるでしょう。前もって感謝します! –

関連する問題