开发者

small line-heights rendering incorrectly in MS Outlook

From doing a little research I've found that MS Outlook will not render line-height in an HTML email at anything less than 16px.

Th开发者_开发技巧is is a bit of a problem as I really need it a fair amount smaller.

Does anyone know of a fix for this??


What code are you using? It will go lower than 16px, but only if the font-size is 14px or smaller. Also, make sure you are setting the line-height on the parent TD - i.e. on the closest block-level element, rather than an inline element.


make sure you have 0 padding and margins, have "display:block" on everything inline (esp. images!) and set line-height to the height you expect.

Outlook <2007 uses IE as a rendering engine, 2010 uses WORD.

Yes, it's very lame.


This CSS might fix the issue, but it will only work on block elements (p, div, ..etc):

mso-line-height-rule:exactly; line-height:10px;

If you are trying to create vertical spacing, use the line-height and font-size to enforce a height:

line-height:5px;font-size:5px;height:5px;

Outlook.com (Hotmail) will override your line-height CSS with theirs, so you need to use this to "reset" your CSS after they modify it:

.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font,
  .ExternalClass td, .ExternalClass div {line-height: 100% !important;}

Outlook.com continued: Then if you have any elements that had line-height:0 you will need to give them an id attribute, and then specifically reset those:

.ExternalClass #elementWithNoLineHeight { line-height:0 !important; }
0

上一篇:

下一篇:

精彩评论

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

最新问答

问答排行榜