开发者

Inline CSS for Email Body - Can get nowrap

开发者 https://www.devze.com 2023-03-19 22:07 出处:网络
I\'m sending inline styles formatted tables to email bodies for sending out reports. The only problem I have is restricting the size of the table.No matter what I\'ve tried, I can\'t get text to wrap

I'm sending inline styles formatted tables to email bodies for sending out reports.

The only problem I have is restricting the size of the table. No matter what I've tried, I can't get text to wrap inside a table. The tables just expand to the length of the longest thing in them.

I've done several different things that all work if I render to a page, but nothing seems to get outlook to wrap text in cells.

For example, no combination of these, even using container divs works:

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

here's a sample (fine on page - when the body of an HTML email opened in Outlook 2007 will not wrap - table goes to a massive width):

      <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-r开发者_JAVA技巧ight: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>

Thanks for any help


It's not supported in Outlook.


The following combination works in Gmail and Thunderbird 11:

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

None of the above and below works in Outlook 2010:

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

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

<div style="overflow: auto;">

<td width="570">`

However, the guys at Microsoft are aware of their e-mail client's weaknesses, so they provided a button to view HTML e-mails in the browser.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号