• http://twitter.com/Hilly_2009 Stephen Hill

    In the conditional statement, is it necessary to duplicate all styles that are in the previous style tag.

    For example, you only have 2 bits of CSS prior to sort a problem in Windows Live Mail (I believe?). But in my ‘template’ I also include a lot of ‘reset’ styles…

    e.g.

    body {
        margin: 0;
        padding: 0;
    }

    img {
        line-height: 100%;
        outline: none;
        text-decoration: none;
    }

    So would it look something similar to…

    body {

        margin: 0;

        padding: 0;

    }

    img {

        line-height: 100%;

        outline: none;

        text-decoration: none;

    }

    body { margin: 0; padding: 0;}img { line-height: 100%; outline: none; text-decoration: none;}.bgemailfix {    background-color: transparent !important;}

    Hope that makes sense!

    • http://www.elliot-ross.co.uk Elliot Ross

      ah see what you mean

      so in theory, the body and img you only need to specify once, then the conditional bit just has bgemailfix. When I was testing this I had other CSS working there too that I stripped out for the demo, and that worked ok. It’s worth noting though, that the body{margin:0;padding:0; won’t have an effect in Outlook anyway as it forces a 15px border on the body regardless.

  • http://www.facebook.com/profile.php?id=718376462 Tony Salazar

    This looks promising.  I’m going to bookmark this for testing later in the week. Great read.

    • http://www.elliot-ross.co.uk Elliot Ross

      cool – let us know how you get on!

  • Kevingroenendaal

    Great and useful post.

  • http://twitter.com/bsisolak Brian Sisolak

    This stumped me for a bit, mentioning it in case anyone else makes this mistake. When I started testing the code I changed the “–” after the exclamation mark to “–“. Just out of habit I guess. When I did that in Outlook 2000, 2002, 2003 and Lotus Notes 8.5 I was seeing the conditional comments displaying in the body (see image).

    After quite of bit of scratching my head I removed the “–” and it works fine now. Stripped down the code to just this for testing.

       
           
               
                .bgemailfix{background-color:transparent !important;}
           
           
       
       
            Content here
       

    Everything seems to work great so far. Tested in Yahoo, Hotmail, Gmail, AOL and Comcast in FF3.6 and IE7-9.

    • http://www.elliot-ross.co.uk Elliot Ross

      cool good work!
      There must be some other uses for a conditional comment that exempts Outlook, going to think about that.. 

  • Grant Evans

    The “if gte mso 9” section breaks the layout in Entourage 2004 & 2008.  When I do my rendering testing through Email On Acid all of the body copy is cleared out.  Has anyone else seen this behavior in Entourage? If I remove that it works.

    • http://www.emaildesignreview.com Elliot

      yes just tested that and having the same issue. I have a simpler fix for this issue, I’m going to update this post later today

      cheers e

  • cory c

     it does not work when you have background in table .

  • Aenima

    Thank you very much, you helped me a lot!