Magento銷售電子郵件未居中
[英]Magento Sale Emails Not Centered
問題描述
我不知道為什么我收到的銷售電子郵件沒有居中。 這是我的電子郵件帳戶（yahoo郵件）的屏幕截圖
它浮動到左邊。 但是在HTML模板中，它已經將外部表的寬度設置為100％，
<table cellspacing="0" cellpadding="0" border="0" width="100%">
和650到內表，
<table bgcolor="#FFFFFF" cellspacing="0" cellpadding="10" border="0" width="650" style="border:1px solid #E0E0E0;">
我還有什么需要設置的嗎？
這是來自app/locale/yourlanguage/template/email/sales/order_new.html的完整HTML代碼
<body style="background:#F6F6F6; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; margin:0; padding:0;">
<div style="background:#F6F6F6; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; margin:0; padding:0;">
<table cellspacing="0" cellpadding="0" border="0" width="100%">
<tr>
<td align="center" valign="top" style="padding:20px 0 20px 0">
<!-- [ header starts here] -->
<table bgcolor="#FFFFFF" cellspacing="0" cellpadding="10" border="0" width="650" style="border:1px solid #E0E0E0;">
<tr>
<td valign="top"><a href="{{store url=""}}"><img src="{{var logo_url}}" alt="{{var logo_alt}}" style="margin-bottom:10px;" border="0"/></a></td>
</tr>
<!-- [ middle starts here] -->
<tr>
<td valign="top">
<h1 style="font-size:22px; font-weight:normal; line-height:22px; margin:0 0 11px 0;">Hello, {{htmlescape var=$order.getBillingAddress().getName()}}</h1>
<p style="font-size:12px; line-height:16px; margin:0 0 10px 0;">
Thank you for your order from {{var store.getFrontendName()}}.
Once your package ships we will send an email with a link to track your order.
If you have any questions about your order please contact us at <a href="mailto:{{config path='trans_email/ident_support/email'}}" style="color:#1E7EC8;">{{config path='trans_email/ident_support/email'}}</a> or call us at <span class="nobr">{{config path='general/store_information/phone'}}</span> Monday - Friday, 8am - 5pm PST.
</p>
<p style="font-size:12px; line-height:16px; margin:0;">Your order confirmation is below. Thank you again for your business.</p>
</td>
</tr>
<tr>
<td>
<h2 style="font-size:18px; font-weight:normal; margin:0;">Your Order #{{var order.increment_id}} <small>(placed on {{var order.getCreatedAtFormated('long')}})</small></h2>
</td>
</tr>
<tr>
<td>
<table cellspacing="0" cellpadding="0" border="0" width="650">
<thead>
<tr>
<th align="left" width="325" bgcolor="#EAEAEA" style="font-size:13px; padding:5px 9px 6px 9px; line-height:1em;">Billing Information:</th>
<th width="10"></th>
<th align="left" width="325" bgcolor="#EAEAEA" style="font-size:13px; padding:5px 9px 6px 9px; line-height:1em;">Payment Method:</th>
</tr>
</thead>
<tbody>
<tr>
<td valign="top" style="font-size:12px; padding:7px 9px 9px 9px; border-left:1px solid #EAEAEA; border-bottom:1px solid #EAEAEA; border-right:1px solid #EAEAEA;">
{{var order.getBillingAddress().format('html')}}
</td>
<td> </td>
<td valign="top" style="font-size:12px; padding:7px 9px 9px 9px; border-left:1px solid #EAEAEA; border-bottom:1px solid #EAEAEA; border-right:1px solid #EAEAEA;">
{{var payment_html}}
</td>
</tr>
</tbody>
</table>
<br/>
{{depend order.getIsNotVirtual()}}
<table cellspacing="0" cellpadding="0" border="0" width="100%">
<thead>
<tr>
<th align="left" width="325" bgcolor="#EAEAEA" style="font-size:13px; padding:5px 9px 6px 9px; line-height:1em;">Shipping Information:</th>
<th width="10"></th>
<th align="left" width="325" bgcolor="#EAEAEA" style="font-size:13px; padding:5px 9px 6px 9px; line-height:1em;">Shipping Method:</th>
</tr>
</thead>
<tbody>
<tr>
<td valign="top" style="font-size:12px; padding:7px 9px 9px 9px; border-left:1px solid #EAEAEA; border-bottom:1px solid #EAEAEA; border-right:1px solid #EAEAEA;">
{{var order.getShippingAddress().format('html')}}
</td>
<td> </td>
<td valign="top" style="font-size:12px; padding:7px 9px 9px 9px; border-left:1px solid #EAEAEA; border-bottom:1px solid #EAEAEA; border-right:1px solid #EAEAEA;">
{{var order.getShippingDescription()}}
</td>
</tr>
</tbody>
</table>
<br/>
{{/depend}}
{{layout handle="sales_email_order_items" order=$order}}
<p style="font-size:12px; margin:0 10px 10px 0">{{var order.getEmailCustomerNote()}}</p>
</td>
</tr>
<tr>
<td bgcolor="#EAEAEA" align="center" style="background:#EAEAEA; text-align:center;"><center><p style="font-size:12px; margin:0;">Thank you again, <strong>{{var store.getFrontendName()}}</strong></p></center></td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</body>
1 個解決方案
解決方案1
1 已采納 2014-06-29 01:43:17
Yahoo將電子郵件的內容包裝在具有display：table樣式的div中。
<div style="display:table">
YOUR EMAIL
</div>
這意味着您的外部表的行為就像放在未指定寬度的表單元中的表一樣，因此100％是該單元的100％。 由於您的內容僅將該表推出650像素，因此外部表也為650像素。
盡管可能還有其他方法，但我能想到的唯一解決方案是將某些文本內容放在表之外。 如果您可以在display：table div內（但不能在固定寬度的元素內）運行一行文本，那么它將擴展該單元格以使其適合所有內容，然后表格的100％將變為該行的100％。
更重要的是，我要注意的是，所有電子郵件客戶端對電子郵件的呈現都略有不同。 如果看起來實際上沒有錯，我可能會保持原樣。 試圖使每個客戶的電子郵件看起來都一樣，這幾乎是一件很難的事。
HTML電子郵件呈現在IE中居中的文本
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.