Grow your CSS skills. Land your dream job.

Creating & sending HTML email tutorial

  • # July 22, 2009 at 11:04 am

    I followed Chris’s brilliant tutorial on "#30 Creating & sending HTML email tutorial" which inspired me to have a go at my own project.

    I completed my task, but the effect and colours vary depending on browser/mail client I view my work in. Is there anyone willing to help with the following problem (not exactly a CSS problem, I know):

    I have a jpg, sliced and saved in in photoshop. The background is grey #666666. This sits next to an html table, which I have coloured up in my html code as #666666.

    When I paste & preview in Thunderbird before sending it everything looks fine. However depending on mail client/browser I view it in, I get different greys showing for these two items. For example it looks good in Thunderbird and Firefox, but no good in Mail & Safari. If it weren’t for the fact that they were sitting side-by-side it wouldn’t be a problem.

    # July 22, 2009 at 11:14 am

    Try disabling colour profiles in photoshop http://www.viget.com/inspire/the-mysterious-save-for-web-color-shift/

    # July 22, 2009 at 12:10 pm

    Thank you for your quick response – don’t have the time to look at it right now. Hopefully this will solve my problem! :)

    # July 22, 2009 at 6:07 pm

    Yep that sorted the problem thanks!

    I did another tutorial a short while ago from a trusted source which totally contradicted the suggestion from the viget site

    http://www.computerarts.co.uk/tutorials/new_media/pixel_perfect_web_layouts

    so with these settings in place I was getting the bad colour.

    Thanks for your help :D

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".