在Outlook 2010 for HTML电子邮件中,行高不起作用 [英] Line-height not working in Outlook 2010 for HTML Email
问题描述
Outlook 2010 / Outlook 2007似乎不符合我的HTML电子邮件中的行高。 (它在Outlook 00和Outlook 03中完美工作)
Outlook 2010/ Outlook 2007 does not appear to be honoring line-height whatsoever in my HTML Email. (It works perfectly in Outlook 00 and Outlook 03)
我一直在做一些大量的google搜索和HTML CSS支持图表我发现说Outlook 2010/2007应该了解线高。
I've been doing some extensive googling - and HTML CSS support charts I have found say that Outlook 2010/2007 SHOULD understand line height.
我试过把line-height放在块父元素和子段落元素上,以及头部样式标签中的ID上,每个组合上面。
I've tried putting the line-height on the block parent element, and the child paragraph element, and as on an ID in the style tag in the head, and every combination of the above.
我还确保我明确声明line-height是一个比文本大小大得多的像素值(但我尝试了%和em)。尝试了!在声明中重要 - 甚至尝试valign和每一个其他提示,我可以在网上找到....我一直在使用线高度。确定按钮padding-top和padding-bottom,因为HTML电子邮件支持填充/边距是如此的bug。
I've also ensured I am explicitly declaring line-height as a pixel value that is significantly larger than the text size (but I tried % and em too). Tried putting !important in the declaration - and even tried valign along with every other tip I could find online.... I have been using line-height to e.g. determine button padding-top and padding-bottom, since HTML Email support for padding/margin is so buggy.
我真的很感激任何帮助。真的在头脑风暴点!
实际的电子邮件是巨大的,因为它是一个复杂的通讯,但这里是一个片段的风格的头部和一个表部分,其中行高不工作 - 我希望这是够了!
The actual email is huge as it's a complicated newsletter, but here is a snippet of the style in the head, and a table section in which the line-height isn't working - I hope that is enough!:
<style type="text/css" media="screen">
html {
-webkit-text-size-adjust:none;
-webkit-background-size:100%;
}
body{
margin: 0px 0px 0px 0px !important;
padding: 0px 0px 0px 0px !important;
margin-bottom:0px !important;
margin-top:0px !important;
background-color:#e5e5e5;
}
p{
margin: 0px 0px 0px 0px !important;
padding: 0px 0px 0px 0px !important;
margin-bottom:0px !important;
margin-top:0px !important;
display:block;
}
a:link, a:visited, a:active{
color:#55c2d9;
text-decoration: underline;
}
a:hover{
text-decoration: underline;
}
.body a:link, a:visited, a:active{
color:#55c2d9;
}
img{
border: 0;
display: block;
}
table.main {
background-color: #ffffff;
width:650px;
}
td {
}
#header-top p{
line-height:33px;
}
</style>
<!-- Content -->
<table border="0" cellspacing="0" cellpadding="0" class="body">
<!-- Row 1 -->
<tr valign="top">
<td background="images/bg-texture-top.jpg" style="background-repeat:repeat-y; background-color:#262626;" valign="top" width="650" height="33" bgcolor="#262626">
<table border="0" cellspacing="0" cellpadding="0" id="header-top">
<!-- Row 1.1 -->
<tr valign="top">
<td style="" valign="top" width="16" height="" bgcolor="">
</td>
<td style="font-family: Helvetica, Arial, sans-serif; color:#767676; font-weight: bold; font-size:11px; line-height:33px; text-align:left; margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; padding-top:0px; padding-bottom:0px; padding-left:0px; padding-right:0px;" width="490" height="33" bgcolor="">
<p><a href="#">click here to view this email in a browser</a></p>
</td>
<td style="font-family: Helvetica, Arial, sans-serif; color:#767676; font-weight: bold; font-size:11px; line-height:33px; text-align:left; margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; padding-top:0px; padding-bottom:0px; padding-left:0px; padding-right:0px;" width="62" height="33" bgcolor="">
<p>find us on:</p>
</td>
<td style="" valign="top" width="16" height="" bgcolor="">
</td>
</tr>
</table>
</td>
</tr>
</table> <!-- Content -->
推荐答案
高度:
< p style =padding:0px; margin:0px; margin-auto:0px; mso-line-height-rule :exact; line-height:110%; font-size:11pt;>段落文本< / p>
是Microsoft专有的CSS属性, mso-line-height-rule:exactly;
。填充只是阻止段落标签创建不必要的空间。
The key element is the Microsoft proprietary CSS attribute, mso-line-height-rule: exactly;
. The padding just prevents the paragraph tags from creating unnecessary space.
这篇关于在Outlook 2010 for HTML电子邮件中,行高不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!