Windows live hotmail adding extra height in Safari Internet Browser

Urgent help!!!!!

Has anyone notice there is an image rending issue with Safari (Mac Internet Broswer) on Hotmail Live, it seem to have the same Images rending issue as firefox on Hotmail Live, by adding an extra 3 or 2 pixel gap on top of images.

If so, please update me:

I have updated the css from:

<head>
    <title>Untitled</title>
    <style media="all" type="text/css">
    table img {
    display:block;
    }
    </style>
</head>

to


<head>
    <title>Untitled</title>
    <style media="all" type="text/css">
    table img {
    display:block !important; padding: 0 !important; margin: 0 auto !important;
    }

background{
    background-repeat : no-repeat;
}
    </style>
</head>

and this seems, not to help fix the problem!

BR

Henke

Mathew Mathew, 8 years ago

Hi Henke,

Have you tried inline styles on those elements to see if you can remove that space at all? That would take out the possibility of styles being stripped at least.


Get in touch with us on Twitter: http://twitter.com/campaignmonitor
We're also on Facebook: http://facebook.com/campaignmonitor
Henry Balogun, 8 years ago

Yes! I have! however nothing seems to work! Looks all well in all other browser but Safari alone

Henry Balogun, 8 years ago

Great!!!!!!!!!

I last I have find the fix to the Safari browser! due to the fact that the Hotmail Live strip out the header CSS code you would have the append the code below to all images on your html page for Safari seek and other like.....

(1)

<head>
    <title>Untitled</title>
    <style media="all" type="text/css">
    table img {display:block;}
    .ai {display:block;}
    </style>
</head>

then on the each images do a "find" and "replace" to all the <img src=""  line as follows

Select

border="0" alt="">

and do a "find" and "replace" using "Homesite" or any other tool with the code below:-

class="ai"  style="display:block;"  border="0" alt="">

It works on Hotmail Live, AOL, Yahoo, Gmail ans Safari

Mathew Mathew, 8 years ago

Thanks for letting us know Henry


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

Thank you very much Henry, for alerting me to the problem (a quick test showed my email has the same problem in Safari), and for posting the solution, which works!

shg, 7 years ago

This thread just saved me a lot of hassle :) thanks!

Jeff-Frye, 7 years ago

You can also include your style in the body section instead of the head section.

...<body>
<style type="text/css">
img {
       display: block;
}
-->
</style>...

This works in Hotmail using Safari, Firefox and IE and keeps you from having to find/replace

It also works in Mac Mail and Entourage as well...

charles_i, 7 years ago

Thanks!!!

I've been looking for a solution for this problem in Firefox as well.  I'm just wondering about putting the STYLE in the body or head since some email clients are known to strip out these codes unless they're inline. Any ideas?

Charles

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