Within Outlook only, text does not inherit the line-height property from any parent element that's nested more than two elements above.
For example, the line-height is applied to these:
<div style="line-height:150%"> Text</div> <div style="line-height:150%"><td> Text</td></div>But not if the style is inline on the body tag or a parent beyond the immediate td the text is in
I have tried combinations of the following:
- With and without
mso-line-height-rule: exactly;before and after line-height style - Line-height value as percents and points (150% and 1.5), I believe only percents work in Outlook, but I tried both anyways
- Placing the style on different elements (td, tr, table, body, etc), only div seems to work, as seen in the examples above
- Removing the
marginstyle property from all elements (I read somewhere that margin can mess with Outlook processing styles, but no dice)
The reason this is an issue for me is because I am building emails in Salesforce, I would like to be able to apply the 150% line-height to the template so we don't need to change the line-height for each block individually that's created.
Does anyone with hyper-specific Outlook development knowledge know of a fix or workaround? Or will I just need to apply the line-height to the individual text blocks to accommodate for Outlook?