带有MFMailComposeViewControllerDelegate的电子邮件正文非常宽
[英]E-Mail body extremely wide with MFMailComposeViewControllerDelegate
问题描述
I'm trying to generate and send a HTML mail using MFMailComposeViewControllerDelegate. 
我正在尝试使用MFMailComposeViewControllerDelegate生成和发送HTML邮件。
However after running the app and opening up the mail view I saw this : 但是，在运行该应用程序并打开邮件视图后，我看到了：
There is an excess of "gray" space both to the left and right of the actual body of my E-Mail. 我的电子邮件的实际正文的左侧和右侧都有多余的“灰色”空间。 What is causing this? 是什么原因造成的？ Is it a problem in my HTML or in the obj-c code? 我的HTML或obj-c代码有问题吗？
edit: as requested here is the html as I think its a safe bet that my problem lies here - Especially since I've never written a single line of it and hacked this together from an online service. 编辑：这里要求的是html，因为我认为这是我的问题所在的一个安全押注-尤其是因为我从未编写过一行代码，并且从未通过在线服务将其一起破解过。 Any help would be greatly appreciated. 任何帮助将不胜感激。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional //EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- saved from url=(0085)file://localhost/Users/litemac/Documents/DamcoAppCoreData/DamcoAppCoreData/index.html -->
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title></title><style type="text/css">
/* Mobile-specific Styles */
@media only screen and (max-device-width: 480px) {
table[class=w0], td[class=w0] { width: 0 !important; }
table[class=w10], td[class=w10], img[class=w10] { width:10px !important; }
table[class=w15], td[class=w15], img[class=w15] { width:5px !important; }
table[class=w30], td[class=w30], img[class=w30] { width:10px !important; }
table[class=w60], td[class=w60], img[class=w60] { width:10px !important; }
table[class=w125], td[class=w125], img[class=w125] { width:80px !important; }
table[class=w130], td[class=w130], img[class=w130] { width:55px !important; }
table[class=w140], td[class=w140], img[class=w140] { width:90px !important; }
table[class=w160], td[class=w160], img[class=w160] { width:180px !important; }
table[class=w170], td[class=w170], img[class=w170] { width:100px !important; }
table[class=w180], td[class=w180], img[class=w180] { width:80px !important; }
table[class=w195], td[class=w195], img[class=w195] { width:80px !important; }
table[class=w220], td[class=w220], img[class=w220] { width:80px !important; }
table[class=w240], td[class=w240], img[class=w240] { width:180px !important; }
table[class=w255], td[class=w255], img[class=w255] { width:185px !important; }
table[class=w275], td[class=w275], img[class=w275] { width:135px !important; }
table[class=w280], td[class=w280], img[class=w280] { width:135px !important; }
table[class=w300], td[class=w300], img[class=w300] { width:140px !important; }
table[class=w325], td[class=w325], img[class=w325] { width:95px !important; }
table[class=w360], td[class=w360], img[class=w360] { width:140px !important; }
table[class=w410], td[class=w410], img[class=w410] { width:180px !important; }
table[class=w470], td[class=w470], img[class=w470] { width:200px !important; }
table[class=w580], td[class=w580], img[class=w580] { width:280px !important; }
table[class=w640], td[class=w640], img[class=w640] { width:300px !important; }
table[class*=hide], td[class*=hide], img[class*=hide], p[class*=hide], span[class*=hide] { display:none !important; }
table[class=h0], td[class=h0] { height: 0 !important; }
p[class=footer-content-left] { text-align: center !important; }
#headline p { font-size: 30px !important; }
.article-content, #left-sidebar{ -webkit-text-size-adjust: 90% !important; -ms-text-size-adjust: 90% !important; }
.header-content, .footer-content-left {-webkit-text-size-adjust: 80% !important; -ms-text-size-adjust: 80% !important;}
img { height: auto; line-height: 100%;}
}
/* Client-specific Styles */
#outlook a { padding: 0; } /* Force Outlook to provide a "view in browser" button. */
body { width: 100% !important; }
.ReadMsgBody { width: 100%; }
.ExternalClass { width: 100%; display:block !important; } /* Force Hotmail to display emails at full width */
/* Reset Styles */
/* Add 100px so mobile switch bar doesn't cover street address. */
body { background-color: #ececec; margin: 0; padding: 0; }
img { outline: none; text-decoration: none; display: block;}
br, strong br, b br, em br, i br { line-height:100%; }
h1, h2, h3, h4, h5, h6 { line-height: 100% !important; -webkit-font-smoothing: antialiased; }
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: blue !important; }
h1 a:active, h2 a:active, h3 a:active, h4 a:active, h5 a:active, h6 a:active { color: red !important; }
/* Preferably not the same color as the normal header link color. There is limited support for psuedo classes in email clients, this was added just for good measure. */
h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited { color: purple !important; }
/* Preferably not the same color as the normal header link color. There is limited support for psuedo classes in email clients, this was added just for good measure. */
table td, table tr { border-collapse: collapse; }
.yshortcuts, .yshortcuts a, .yshortcuts a:link,.yshortcuts a:visited, .yshortcuts a:hover, .yshortcuts a span {
color: black; text-decoration: none !important; border-bottom: none !important; background: none !important;
} /* Body text color for the New Yahoo. This example sets the font of Yahoo's Shortcuts to black. */
/* This most probably won't work in all email clients. Don't include <code _tmplitem="282" > blocks in email. */
code {
white-space: normal;
word-break: break-all;
}
#background-table { background-color: #ececec; }
/* Webkit Elements */
#top-bar { border-radius:6px 6px 0px 0px; -moz-border-radius: 6px 6px 0px 0px; -webkit-border-radius:6px 6px 0px 0px; -webkit-font-smoothing: antialiased; background-color: #043948; color: #e7cba3; }
#top-bar a { font-weight: bold; color: #e7cba3; text-decoration: none;}
#footer { border-radius:0px 0px 6px 6px; -moz-border-radius: 0px 0px 6px 6px; -webkit-border-radius:0px 0px 6px 6px; -webkit-font-smoothing: antialiased; }
/* Fonts and Content */
body, td { font-family: 'Helvetica Neue', Arial, Helvetica, Geneva, sans-serif; }
.header-content, .footer-content-left, .footer-content-right { -webkit-text-size-adjust: none; -ms-text-size-adjust: none; }
/* Prevent Webkit and Windows Mobile platforms from changing default font sizes on header and footer. */
.header-content { font-size: 12px; color: #e7cba3; }
.header-content a { font-weight: bold; color: #e7cba3; text-decoration: none; }
#headline p { color: #e7cba3; font-family: 'Helvetica Neue', Arial, Helvetica, Geneva, sans-serif; font-size: 36px; text-align: center; margin-top:0px; margin-bottom:30px; }
#headline p a { color: #e7cba3; text-decoration: none; }
.article-title { font-size: 18px; line-height:24px; color: #9a9661; font-weight:bold; margin-top:0px; margin-bottom:18px; font-family: 'Helvetica Neue', Arial, Helvetica, Geneva, sans-serif; }
.article-title a { color: #9a9661; text-decoration: none; }
.article-title.with-meta {margin-bottom: 0;}
.article-meta { font-size: 13px; line-height: 20px; color: #ccc; font-weight: bold; margin-top: 0;}
.article-content { font-size: 13px; line-height: 18px; color: #444444; margin-top: 0px; margin-bottom: 18px; font-family: 'Helvetica Neue', Arial, Helvetica, Geneva, sans-serif; }
.article-content a { color: #00707b; font-weight:bold; text-decoration:none; }
.article-content img { max-width: 100% }
.article-content ol, .article-content ul { margin-top:0px; margin-bottom:18px; margin-left:19px; padding:0; }
.article-content li { font-size: 13px; line-height: 18px; color: #444444; }
.article-content li a { color: #00707b; text-decoration:underline; }
.article-content p {margin-bottom: 15px;}
.footer-content-left { font-size: 12px; line-height: 15px; color: #e2e2e2; margin-top: 0px; margin-bottom: 15px; }
.footer-content-left a { color: #e7cba3; font-weight: bold; text-decoration: none; }
.footer-content-right { font-size: 11px; line-height: 16px; color: #e2e2e2; margin-top: 0px; margin-bottom: 15px; }
.footer-content-right a { color: #e7cba3; font-weight: bold; text-decoration: none; }
#footer { background-color: #043948; color: #e2e2e2; }
#footer a { color: #e7cba3; text-decoration: none; font-weight: bold; }
#permission-reminder { white-space: normal; }
#street-address { color: #e7cba3; white-space: normal; }
</style>
<!--[if gte mso 9]>
<style _tmplitem="282" >
.article-content ol, .article-content ul {
margin: 0 0 0 24px;
padding: 0;
list-style-position: inside;
}
</style>
<![endif]--></head><body><table width="100%" cellpadding="0" cellspacing="0" border="0" id="background-table">
<tbody><tr>
<td align="center" bgcolor="#ececec">
<table class="w640" style="margin:0 10px;" width="640" cellpadding="0" cellspacing="0" border="0">
<tbody><tr><td class="w640" width="640" height="20"></td></tr>
<tr>
<td class="w640" width="640">
<table id="top-bar" class="w640" width="640" cellpadding="0" cellspacing="0" border="0" bgcolor="#FFFFFF">
<tbody><tr>
<td class="w15" width="15"></td>
<td class="w325" width="350" valign="middle" align="left">
<table class="w325" width="350" cellpadding="0" cellspacing="0" border="0">
<tbody><tr><td class="w325" width="350" height="8"></td></tr>
</tbody></table>
<div class="header-content" align="right"><span class="hide"> | <time lang="en">Damco Sales Visit</time> | <timestamp>12-12-2012</timestamp> | </span></div>
<table class="w325" width="350" cellpadding="0" cellspacing="0" border="0">
<tbody><tr><td class="w325" width="350" height="8"></td></tr>
</tbody></table>
</td>
<td class="w30" width="10"></td>
</tr>
</tbody></table>
</td>
</tr>
<tr>
<td id="header" class="w640" width="640" align="center" bgcolor="#FFFFFF">
<div align="left" style="text-align: left">
<img id="customHeaderImage" label="Header Image" editable="true" width="144" src="Logo.png" class="w640" border="0" align="top" style="display: inline">
</div>
</td>
</tr>
<tr id="customer-info-row"><td class="w640" width="640" height="30" bgcolor="#ffffff"></td></tr>
<tr id="simple-content-row"><td class="w640" width="640" bgcolor="#ffffff">
<table class="w640" width="640" cellpadding="0" cellspacing="0" border="0">
<tbody><tr>
<td class="w30" width="30"></td>
<td class="w580" width="580">
<repeater>
<layout label="Text only">
<div align="left" class="article-content">
<multiline label="Description">
Dear //CUSTOMER_NAME//,<br>
<br>
<br>
Thank you for a pleasant meeting.
Please find below an overview of the products and services we discussed during our meeting
and the notes to the products/services we agreed follow up on.<br>
<br>
//NOTE_TO_CUSTOMER//
</multiline>
</div>
</layout>
<hr>
<layout label="Two columns">
<table class="w580" width="580" cellpadding="0" cellspacing="0" border="0">
<tbody><tr>
<td class="w275" width="275" valign="top">
<table class="w275" width="580" cellpadding="0" cellspacing="0" border="0">
<tbody><tr>
<td class="w275" width="275">
<p align="left" class="article-title"><singleline label="Title">PREMIUM OFFERINGS</singleline></p>
<div align="left" class="article-content">
</div>
</td>
<td class="w275" width="30">
<td class="w275" width="275">
<p align="left" class="article-title"><singleline label="Title">NOTES</singleline></p>
<div align="left" class="article-content">
</div>
</td>
</tr>
//PREMIUM_PLACEHOLDER//
</tbody></table>
</td>
</tr>
</tbody></table>
</layout>
</repeater>
<repeater>
<layout label="Text only">
</layout>
<layout label="Two columns">
<table class="w580" width="580" cellpadding="0" cellspacing="0" border="0">
<tbody><tr>
<td class="w275" width="275" valign="top">
<table class="w275" width="580" cellpadding="0" cellspacing="0" border="0">
<tbody>
<tr>
<td class="w275" width="275">
<p align="left" class="article-title"><singleline label="Title">SUPPLY CHAIN OFFERINGS</singleline></p>
<div align="left" class="article-content">
</div>
</td>
<td class="w275" width="30"></td>
<td class="w275" width="275">
<p align="left" class="article-title"><singleline label="Title">NOTES</singleline></p>
<div align="left" class="article-content">
</div>
</td>
</tr>
//SUPPLYCHAIN_PLACEHOLDER//
</tbody></table>
</td>
</tr>
</tbody></table>
</layout>
</repeater>
<hr>
<layout label="Text only">
<div align="left" class="article-content">
<multiline label="Description">
Best regards,<br>
<br>
//SALESPERSON_NAME//<br>
M: //SALESPERSON_MOBILE//<br>
E: //SALESPERSON_EMAIL//<br>
W: <a href="http://dummypage.dk">http://www.dummy.com</a><br>
</multiline>
</div>
</layout>
</td>
<td class="w30" width="30"></td>
</tr>
</tbody></table>
</td></tr>
<tr><td class="w640" width="640" height="15" bgcolor="#ffffff"></td></tr>
<tr>
<td class="w640" width="640">
<table id="footer" class="w640" width="640" cellpadding="0" cellspacing="0" border="0" bgcolor="#043948">
<tbody><tr><td class="w30" width="30"></td><td class="w580 h0" width="360" height="30"></td><td class="w0" width="60"></td><td class="w0" width="160"></td><td class="w30" width="30"></td></tr>
<tr>
<td class="w30" width="30"></td>
<td class="w580" width="360" valign="top">
<span class="hide"><p id="terms" align="left" class="footer-content-left"><span>More Text....</span><br>
<span></span><br>
<span><b>About Damco</b></span><br>
<span>Text....</span></p></span>
</td>
</tr>
<tr><td class="w30" width="30"></td><td class="w580 h0" width="360" height="15"></td> <td class="w0" width="60"></td><td class="w0" width="160"></td><td class="w30" width="30"> </td></tr>
</tbody></table>
</td>
</tr>
<tr><td class="w640" width="640" height="60"></td></tr>
</tbody></table>
</td>
</tr>
</tbody></table>
</body></html>
2 个解决方案
解决方案1
0 2012-11-04 21:03:27
Your problem is with the HTML. 您的问题在于HTML。 There isn't anything you can accidentally do in iOS or ObjectiveC to cause this problem. 您无法在iOS或ObjectiveC中意外地执行任何操作来导致此问题。
It's tempting to copy HTML from bloat-inducing editors (I've been guilty of copying HTML generated by MS Word), but it unquestionably costs in the bloat factor, and more often than not causes undesired side effects. 从诱人的编辑器中复制HTML是很诱人的（我一直对复制由MS Word生成的HTML感到内）），但这无疑是在膨胀因素上付出了代价，而且常常会造成不希望的副作用。 Importantly, the bloat makes it much more difficult to debug even simple HTML issues. 重要的是，膨胀甚至使调试简单的HTML问题变得更加困难。
How about this: Rather than start with bloated HTML and pare back to avoid funky margins, why not start with minimal HTML and add just what you need to get the look you want? 怎么办呢？为什么不以膨胀的HTML开头并削减以避免时髦的边距，为什么不以最小的HTML开头并添加所需的内容以获得所需的外观呢？
Either way, you can (and should) test your HTML in a file in an HTML editor (or even a browser) before you plug it into your iOS app code. 无论哪种方式，您都可以（而且应该）在将HTML插入iOS应用程序代码之前，在HTML编辑器（甚至是浏览器）中测试文件中的HTML。 If you have an HTML problem, post it as a separate question here and someone will answer it quickly. 如果您有HTML问题，请在此处将其作为单独的问题发布，然后有人会迅速回答。 Good luck! 祝好运！
解决方案2
0 已采纳 2012-11-09 11:27:06
Seems that this single line was causing all my issues; 似乎这条线导致了我所有的问题；
body { width: 100% !important; }
Removing it resolved my problem. 删除它解决了我的问题。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.
相关问题
VBA中电子邮件正文的字体样式 - Font style for e-mail body in VBA
简化字符串中的电子邮件正文？ - Simplify e-mail body in string?
格式化电子邮件正文 HTML - Formatting e-mail body HTML
通过电子邮件通讯中的mailto设置电子邮件正文的表格 - Form to Set body of E-mail via mailto in E-Mail Newsletter
电子邮件的HTML正文中的VBA IF条件 - VBA IF-Condition within an HTML-Body of an E-Mail
用VBA代码创建的电子邮件的全局HTML正文 - Global HTML-Body of an E-Mail created in a VBA code
超链接PNG图像以打开/下载到Outlook电子邮件正文中 - HyperLinking PNG images to open/download into an Outlook e-mail body
PowerShell电子邮件-使用HTML正文发送.csv - PowerShell e-mail - sending .csv in body with HTML
电子邮件签名 - E-Mail Signature
电子邮件模板和前景 - E-mail template and outlook
相关标签