2013 End-Of-Year Fundraising Discussion

Michelle Riddle:

Hi,

 

We're using the templates in the EOY kit (they appear to be the same as 2012). In some browser/email combos, and in the view on the website, a horizontal space appears between the header and the text area. With the design we're using this year (where the art actually touches that horizontal bar above the text area) this is really unfortunate.

 

We tried adding style="display:block; to the image tag for the header and that helped to eliminate or decrease the extra space between the header and the body of the email in some different browser and email client combinations, but it didn't eliminate it entirely. 

 

What else can we do? I'm thinking that if you supplied this as a template two years in a row, you might have some helpful hints.

 

thanks very much,

 

Michelle

Hi Michelle,

Can you provide a screenshot?

Kent

Michelle Riddle:

Hi, Thanks -  I hadn't realized you'd responded.

 

You can see the first one here: http://ions.convio.net/site/MessageViewer?em_id=11365.0&dlv_id=35161

 

You see the space underneath the four kids - between them and the light blue line below.

 

It doesn't do this in all email clients, but some, and most browsers, apparently.

 

Thoughts?

 

 

Hi Michelle,

Beautiful email. Looks like the email is displaying correctly in the most common email providers - I tested in Outlook 2010, Hotmail, Yahoo and Gmail. It looks like the space under the header image is caused by a style in one of the stylesheets on your website. It is getting pulled in when displaying the email message using the Message Viewer link. 

A possible solution would be to suppress the Page Wrapper from being used when viewing through Message Viewer. You can do that by adding a tiny bit of code at the end of the Message Viewer link: &pgwrap=n

The full URL then, would look like this:

http://ions.convio.net/site/MessageViewer?em_id=11421.0&pgwrap=n

Or, if you want to make that dynamic so that it automatically updates you can use this link:

http://ions.convio.net/site/MessageViewer?em_id=[[A8]].0&pgwrap=n

Hope that helps. Let me know if you still run into trouble with this.

Cheers,

Robin

Michelle Riddle:
Hi Robin,



Thanks for your help and your kind words. The dynamic message viewer link

seems to solve the space problem when the email is viewed our website. (Did

you happen to identify what code in what stylesheet was causing the

problem?)



However, when I used Email on Acid to test the email before I sent the

first one, there were still a number of other situations in which the space

appeared. I don't now recall what they were, though one was one of the aol

instances. I will do another of those tests as I set up the next couple of

versions we'll be sending out, and perhaps I could ask you your thoughts

then.



thanks very much!

p.s. I just noticed your Ezra Bayda quote -- that's great :-)

Michelle Riddle:

Hi again,

 

I did an email on acid test of the next version and everything I tried (admittedly not every combination) came out the way it's supposed to. Odd, but I'll take it as good. If you do know what code conflict you found, if you can tell me that would be great.

 

thanks,

Michelle

Hi Michelle,

Yes - sure thing. The style that appears to be causing that extra space is this:

table tr td {

    padding: 2px;

}

which is located in your master.css file. I located this using a plugin for Firefox called Firebug. Highly recommend it if you like getting nerdy and into the code.

Hope that helps. Post back if you run into any more problems.

Cheers,

Robin

P.S. Thanks! Love Ezra Bayda.

Michelle Riddle:
Thanks very much!



I tried clicking "Give Kudos" at the bottom of the email, but it took me to

the Community site and when I tried to log in, an error was generated.

So...



Kudos :-)



Have a great holiday :-)

Thanks Michelle, you too!