Встроенный CSS для тела электронной почты - можно получить сейчас - PullRequest
Новая
       19

Встроенный CSS для тела электронной почты - можно получить сейчас

3 голосов
/ 13 июля 2011

Я отправляю отформатированные таблицы встроенных стилей в тела электронной почты для отправки отчетов.

Единственная проблема, которую я имею, - это ограничение размера таблицы. Независимо от того, что я пробовал, я не могу получить текст для переноса внутри таблицы. Таблицы просто расширяются до длины самой длинной вещи в них.

Я сделал несколько разных вещей, которые все работают, если я рендеринг на страницу, но, похоже, ничто не дает перспективу обернуть текст в ячейки.

Например, ни одна из этих комбинаций, даже с использованием контейнерных элементов div, не работает: 

width:1000px;
table-layout:fixed;
word-wrap:break-word;

вот пример (отлично на странице - когда тело HTML-письма, открытого в Outlook 2007, не переносится - таблица имеет большую ширину): 

      <table style="margin-top:5px;width:1000px;table-layout:fixed;word-wrap:break-word;border-collapse: collapse;background-color: #dfe1e4;">
     <tr>
                   <th nowrap="true" style="text-align:center; font-size:14px;border: 1px solid #A69F9F;padding-right:10px;padding-left:10px;background-color: #42669a;color:#f0f8ff;">Description</th>
     </tr>
     <tr>
        <td style="word-wrap:break-word;text-align:left;padding-left:5px;padding-right:15px;border: 1px solid #A69F9F;">
            asdfasdfasdfasd2222222222222222222222222222222222222asdfasdfasdasdfasdfasdfasd2222222222222222222222222222222222222asdfasdfasdasdfasdfasdfasd2222222222222222222222222222222222222asdfasdfasdasdfasdfasdfasd2222222222222222222222222222222222222asdfasdfasdasdfasdfasdfasd2222222222222222222222222222222222222asdfasdfasdasdfasdfasdfasd2222222222222222222222222222222222222asdfasdfasdasdfasdfasdfasd2222222222222222222222222222222222222asdfasdfasdasdfasdfasdfasd2222222222222222222222222222222222222asdfasdfasdasdfasdfasdfasd2222222222222222222222222222222222222asdfasdfasdasdfasdfasdfasd2222222222222222222222222222222222222asdfasdfasdasdfasdfasdfasd2222222222222222222222222222222222222asdfasdfasdasdfasdfasdfasd2222222222222222222222222222222222222asdfasdfasdasdfasdfasdfasd2222222222222222222222222222222222222asdfasdfasdasdfasdfasdfasd2222222222222222222222222222222222222asdfasdfasdasdfasdfasdfasd2222222222222222222222222222222222222asdfasdfasdasdfasdfasdfasd22222222222222222!
 22222222222222222222asdfasdfasdasdfasdfasdfasd2222222222222222222222222222222222222asdfasdfasd 
<br>asdfasdfasdf asdf asdf asdf asdf asd fasd fasdf a
<br>asdfasdfasdfasd2222222222222222222222222222222222222asdfasdfasdasdfasdfasdfasd2222222222222222222222222222222222222asdfasdfasdasdfasdfasdfasd2222222222222222222222222222222222222asdfasdfasdasdfasdfasdfasd2222222222222222222222222222222222222asdfasdfasdasdfasdfasdfasd22asdfasd2222222222222222222222222222222222222asdfasdfasd 
<br>asdfasdfasdf asdf asdf asdf asdf asd fasd fasdf a
        </td>
     </tr>
   </table>

Спасибо за любую помощь

Ответы [ 2 ]

4 голосов
/ 13 июля 2011
3 голосов
/ 27 марта 2012

Следующая комбинация работает в Gmail и Thunderbird 11: 

<td style="max-width: 570px; word-wrap: break-word;">

Ничто из перечисленного и ниже не работает в Outlook 2010: 

<table style="table-layout: fixed;">

<table style="table-layout: fixed; width: 570px;">

<div style="overflow: auto;">

<td width="570">`

Однако ребята из Microsoft знаютиз-за слабости их почтового клиента, поэтому они предоставили кнопку для просмотра электронных писем HTML в браузере.

...