multiline tags and paragraph styling

Hello,

I am working on a template for some clients that features some text that needs to display with a line-height aside from the default line-height.   I was able to get this text to display properly cross browser by using <p style="line-height:2em" > tags around the text.   I am trying to replicate this while using your <multiline> tags but Im having inconsistent results.  I tried the following code:

<td  style="line-height:2em"  width="364">
    <p style="line-height:2em">
        <multiline>
Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.
        </multiline>    
    </p>                                        
</td>

Unfortunately once the Filler Text has been edited and I send a test email, my styled paragraph tag no longer contains my Text.  And a new paragraph tag has been created to surround the text that doesn't include my styling.  The result is as follows:

<td  style="line-height:2em"  width="364">
    <p style="line-height:2em"></p>
        <p style="padding-top:0px;padding-bottom:0px;margin-top:0px;margin-bottom:0px">
Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.  Filler Text Here.
    </p>                                        
</td>

Luckily some email client software will allow the line-height to be inherited from the <td>.   But some will not and the text displays single spaced.   I have also tried adding this style directly to the multiline tag, but those style properties are not reflected in the final output. 

Does anyone have a suggestion of how to reliably apply a style to a paragraph that contains a <multiline></mulitiline> section?

If possible I want all the styling done on my end (i.e. in the template itself) so my clients have to do the minimum amount of formatting when they are adding their content.

Thanks,
Emily

roshodgekiss roshodgekiss, 5 years ago

Hi Emily! The best advice here is to remove the inline styles in this example and use CSS styles in the <head> instead. As you've seen here, the <multiline> tags automatically add <p> tags of their own around the filler text, so adding an additional set of <p> tags will result in inconsistent spacing. Something like:

p { line-height:2em; margin: 0; padding: 0; }

... should suffice. We automatically inline CSS styles upon import of your template into the app, so hopefully this should do the trick. All the best! :D


Get in touch with us on Twitter: http://twitter.com/campaignmonitor
We're also on Facebook: http://facebook.com/campaignmonitor

Join 200,000 companies around the world that use Campaign Monitor to run email marketing campaigns that deliver results for their business.

Get started for free
1-888-533-8098