Email Preview does not match Live Preview

Christinabr
Member

Hi There!

I'm working on customizing an E-Mail footer. When working on it, I have the module set like I would like in the design manager. 

It looks like this: 

design manager.png

 

 

 

 

 

 

 

 

 

 

Then, when I drop the module into the template and view it in my E-Mail preview, it looks like this: 

realtime.png

 

I saw a post relating to a website where it was suggested to check the CSS. From what I can tell, there is no over riding CSS formatting going on. My links work great, I just need them to view properly! Thank you in advance for your help!

0 Upvotes
1 Reply 1
narmstrong
Contributor | Platinum Partner

Hi,

The problem with emails is some CSS is ignored especiaslly on text elements.

Have you attempter to put your layout in a table that will give you the layout you want?

e.g. 

<table>

    <tr>

        <td><img src="fb-icon-url.jpg" alt="facebook"></td>

        <td><img src="twitter-icon-url.jpg" alt="twitter"></td>

        <td>etc</td>

        <td>etc</td>

    </tr>

</table>

 

Most effective CSS in emails is inline in the element from my experience.

 

Here is a pretty good guide to what works and what doesnt in emails.

https://www.campaignmonitor.com/css/

Best of luck.

Noah Armstrong | TSL Marketing
Senior Developer
6085 Marshalee Dr| Suite 100 | Elkridge, MD 21075
Contact Us

TSL Marketing
0 Upvotes