0
У меня есть электронный бюллетень, который я должен был указать для одного из наших клиентов. После кодирования всего, что я отправил тест через нашу постоянную контактную учетную запись. Я тестировал Gmail, Yahoo & Mac Mail, и они отлично работают. Когда я отправляю его в электронную почту Outlook 2013, он отображается неправильно. Я использую вложенные таблицы. Особым местом, представляющим проблему, является таблица с id = "visa". Я также добавил скриншот о том, как это выглядит.Outlook 2013 не отображает правильную ширину для вложенной таблицы для моего электронного бюллетеня
Когда я открываю письмо в Outlook 2013 и нажимаю «Действия» -> «Редактировать сообщение», щелкните правой кнопкой мыши область «Виза» и выберите «Свойства таблицы». Я заметил, что предпочтительная ширина поля черного цвета, но не проверена. Если я перейду к свойствам верхней левой ячейки, где говорится «Перенести баланс ...» и щелкните поле «Предпочтительная ширина», тогда все правильно выстроится без пробела.
Почему Outlook 2012 не принимает ширину, которую я предоставляю в своем HTML? Что делать, чтобы сделать это автоматически, так что получатели Outlook будут правильно видеть информационный бюллетень.
Вот мой код:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>index.jpg</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css"> td img {border-width: 0px;
display: block;
}
</style>
</head>
<body bgcolor="#ffffff"> <!-- 'Myriad Pro', Arial,sans-serif; -->
<table border="0" cellpadding="0" cellspacing="0" width="600" align="center" style="font-family:'Myriad Pro', Arial,sans-serif; border:1px solid black;">
<tr>
<td colspan="3" style="vertical-align:top; padding:0;"><a href="https://www.rbfcu.coop/" target="_blank"><img name="index_r1_c1" src="https://www.mpsecureapps.com/clients/raritan_bay/15-00477/images/header.jpg" width="600" height="134" border="0" id="index_r1_c1" alt="" /></a></td>
</tr>
<tr>
<!--=====================================
== LEFT SIDE RAIL START (nested table)
=========================================-->
<td width="209" style="vertical-align:top; padding:0; background-color:#e0e6f4;">
<table border="0" cellpadding="0" cellspacing="0" width="209" style="font-family:'Myriad Pro', Arial,sans-serif; font-size:11px;">
<tr>
<td style="vertical-align:top; padding:20px 0 0 0;"><img name="vacation" src="https://www.mpsecureapps.com/clients/raritan_bay/15-00477/images/keyboard.jpg" width="209" border="0" id="vacation" alt="" /></td>
</tr>
<tr>
<td style="vertical-align:top; padding:0;">
<p style="margin:10px 0 0 15px; color:#2063af; font-size:15px;"><strong>Money Moves To Make<br />
This Season</strong></p>
<p style="margin:5px 0 0 15px; line-height:15px;">As the year starts winding down,<br />
here are some smart moves to make<br />
with your money to maximize your<br />
earnings and save through the<br />
winter.</p>
<p style="margin:10px 0 0 15px; color:#2063af; font-size:14px;"><strong>Give Yourself A Checkup</strong></p>
<p style="margin:5px 0 0 15px; line-height:15px;">Use a free online budgeting and<br />
money management tool, like the<br />
resources on our<a href="http://www.rbfcu.coop/services/financial-services/members-financial-services.html" target="_blank"> Members Financial<br />
Services Page</a> or the one on Mint.<br />
com to make it easy, or review<br />
your credit union statements and<br />
check for areas where you may be<br />
overspending. Also, review your<br />
health care coverage and see if you<br />
can save if you change to a different<br />
plan during open enrollment.</p>
<p style="margin:10px 0 0 15px; color:#2063af; font-size:14px;"><strong>Prepare For Holiday Spending</strong></p>
<p style="margin:5px 0 0 15px; line-height:15px;">To avoid one massive bill at the end<br />
of the year, start shopping now and<br />
finish before things get crazy. Also,<br />
paying off your credit card bills every<br />
month will help you save on interest<br />
charges.</p>
<p style="margin:10px 0 0 15px; color:#2063af; font-size:14px;"><strong>Put More Into<br />
Retirement Accounts</strong></p>
<p style="margin:5px 0 0 15px; line-height:15px;">Contribute the maximum amount<br />
possible to prepare for the future.</p>
<p style="margin:10px 0 0 15px; color:#2063af; font-size:14px;"><strong>Weatherproof Your Home</strong></p>
<p style="margin:5px 0 0 15px; line-height:15px;">Prepare your home for colder<br />
weather by caulking windows,<br />
weatherstripping doors, making<br />
sure you have enough insulation<br />
and getting a tune-up on your<br />
heating unit. It could save you tons<br />
in heating costs.</p>
</td>
</tr>
</table>
</td>
<td width="22" style="vertical-align:top; padding:0;">
</td>
<!--=====================================
== BODY START (nested table)
=========================================-->
<td width="369" style="vertical-align:top; padding:0;">
<table border="0" cellpadding="0" cellspacing="0" width="369" style="font-family:'Myriad Pro', Arial,sans-serif; font-size:11px;">
<tr>
<td width="369" style="vertical-align:top; padding:0;">
<table id="visa" border="0" cellpadding="0" cellspacing="0" width="369" style="width:369px; font-family:Arial,sans-serif; font-size:9px;">
<tr>
<td width="132" style="vertical-align:top; padding:0; ">
<p style="margin:5px 0 0 0; color:#2063af; font-size:12px;"><strong><span style="font-size:13px;">Transfer Your<br />Balance And Save</span><br />
Lower Your Monthly<br />
Credit Card Payment</strong></p>
</td>
<td width="74" style="vertical-align:top; padding:0;">
<p style="margin:0;">
<img style="display:block;" name="n1500477RaritanBayAug_e_NL151_r1_c2" src="https://www.mpsecureapps.com/clients/raritan_bay/15-00477/images/index_r1_c2.jpg" width="74" border="0" id="n1500477RaritanBayAug_e_NL151_r1_c2" alt="" />
</p>
</td>
<td width="163" style="vertical-align:top; padding:0;">
<p style="margin:0;">
<img style="display:block;" name="n1500477RaritanBayAug_e_NL151_r1_c3" src="https://www.mpsecureapps.com/clients/raritan_bay/15-00477/images/index_r1_c3.jpg" width="163" border="0" id="n1500477RaritanBayAug_e_NL151_r1_c3" alt="" />
</p>
</td>
</tr>
<tr>
<td colspan="2" style="vertical-align:top; padding:0;">
<p style="margin:5px 0 0 0; line-height:15px;">If you're currently paying too much interest<br />
on your credit card balance, RBFCU can<br />
help lower your monthly payment. Transfer<br />
your high-interest debt from other credit<br />
cards to the Raritan Bay FCU Platinum Visa®<br />
and you could lower the monthly payment<br />
on your existing balance. With no balance<br />
transfer fee and a fixed rate as low as 9.99%<br />
APR* you could save big.
</p>
<p style="margin:5px 0 0 0;">Other Advantages Include:</p>
<p style="margin:5px 0 0 0;"><span style="color:#0167b1;">■ </span>No annual or balance transfer fees</p>
<p style="margin:5px 0 0 0;"><span style="color:#0167b1;">■ </span>24/7 customer service</p>
<p style="margin:5px 0 0 0;"><span style="color:#0167b1;">■ </span>25-day grace period on new purchases</p>
<p style="margin:5px 0 0 0;"><span style="color:#0167b1;">■ </span>Valuable ScoreCard® Rewards Points</p>
<p style="margin:5px 0 0 0;">Don't miss this chance to save.</p>
</td>
<td width="163" style="vertical-align:top; padding:0;">
<p style="margin:0;">
<img style="display:block;" name="n1500477RaritanBayAut_e_NL151_r2_c3" src="https://www.mpsecureapps.com/clients/raritan_bay/15-00477/images/index_r2_c3.jpg" width="163" border="0" id="n1500477RaritanBayAug_e_NL151_r2c3" alt="" />
</p>
</td>
</tr>
<tr>
<td colspan="3" style="vertical-align:top; padding:0;">
<p style="margin:10px 0 0 0; color:#2063af; font-size:12px;"><strong>Apply Today!</strong></p>
<p style="margin:5px 0 0 0;">Apply online today or call (732) 727-3500 ext. 220.</p>
<p style="margin:5px 0 10px 0; font-size:8px;">*APR = Annual Percentage Rate. Qualified borrowers only. Rate subject to change without notification. Contact the credit union for complete details. Other rates available based on creditworthiness.</p>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td style="vertical-align:top; padding:10px 0 0 0; border-top:1px solid #0167b1;">
<table border="0" cellpadding="0" cellspacing="0" width="369" style="font-family:'Myriad Pro', Arial,sans-serif;">
<tr>
<td width="185" style="vertical-align:top; padding:0; font-size:11px; border-right:1px solid #0167b1;">
<img src="https://www.mpsecureapps.com/clients/raritan_bay/15-00477/images/chalkboard.jpg" width="185" />
<p style="margin:10px 0 0 0; color:#2063af; font-size:15px;"><strong>Take A Deserved Break<br />
With A Teacher Loan</strong></p>
<p style="margin:5px 0 0 0;">A Teacher Loan* from Raritan Bay<br />
FCU is perfect for educators, since<br />
you can take two months off of<br />
your payments. Borrow at a low<br />
rate for whatever you need and<br />
don’t worry about paying during<br />
the summer break.</p>
<p style="margin:5px 0 0 0; color:#2063af; font-size:14px;"><strong>Advantages Include:</strong></p>
<p style="margin:5px 10px 0 0;"><span style="color:#0167b1;">■ </span>Low rates</p>
<p style="margin:5px 10px 0 0;"><span style="color:#0167b1;">■ </span>Auto and signature loans</p>
<p style="margin:3px 10px 0 13px;">available</p>
<p style="margin:5px 10px 0 0;"><span style="color:#0167b1;">■ </span>Make only 10 payments per</p>
<p style="margin:3px 10px 0 13px;">year</p>
<p style="margin:5px 10px 0 0;"><span style="color:#0167b1;">■ </span>Skip two months of loan</p>
<p style="margin:3px 10px 0 13px;">payments</p>
<p style="margin:5px 0 0 0;">Call us at (732) 727-3500 ext.<br />
220 and ask about our Teacher’s<br />
Loan option today.</p>
<p style="margin:5px 0 0 0; font-size:8px;">*Qualified borrowers only. Interest will continue<br />
to accumulate on your loan during the months a<br />
payment is not made. Please contact a Credit Union<br />
Representative for rates, terms and conditions.</p>
</td>
<td width="184" style="vertical-align:top; padding:0; font-size:11px;">
<p style="margin:0 0 0 0;"><img src="https://www.mpsecureapps.com/clients/raritan_bay/15-00477/images/back_to_class.jpg" width="184" /></p>
<p style="margin:10px 0 0 10px; color:#2063af; font-size:14px;"><strong><span style="font-size:15px;">Head Back To Class With<br />
Everything You Need</span><br />
<em>With A Raritan Bay FCU<br />
<a style="color:#0167b1;" href="http://www.rbfcu.coop/loans/promo-loan.html" target="_blank">Back To School</a> Loan</em></strong></p>
<p style="margin:5px 0 0 10px;">It’s that time of year again, when<br />
you need to shop for school<br />
supplies, books, clothes, computers<br />
and other items for the upcoming<br />
school year. Raritan Bay FCU makes<br />
it easier for parents and students<br />
with a special low-rate Back to<br />
School Loan.</p>
<p style="margin:5px 0 10px 10px; font-size:8px;">*APR = Annual Percentage Rate. Qualified borrowers only. Rates subject to change without notification.</p>
<hr style="color:#0167b1; width:170px" />
<p style="margin:10px 0 0 10px; color:#2063af; font-size:14px;"><strong>Holiday Closing</strong></p>
<p style="margin:5px 0 0 10px;">Labor Day<br />
Monday, September 7, 2015</p>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
я не смог загрузить изображение, но где он имеет изображение карточки Visa он имеет расстояние справа и снизу. И текст слева от него имеет более узкую ширину, чем указано в теге td. –