Inline style doesn't work in Email header logo on custom template

Question

Can you please tell why the inline css doesn't work on header logo.

I use the custom email template for sending email.

I send two custom emails. 1st works fine but in second email the inline style doesn't work on header logo.

Please see the email template 1st and 2nd.

1st email template is :

<!--@subject LifeStyle Gallery Upload Notification @-->
<!--@vars
{"store url=\"\"":"Store Url",
"var logo_url":"Email Logo Image Url",
"var logo_alt":"Email Logo Image Alt",
"var data.customerName":"Customer Name"}
@-->

<!--@styles
body,td { color:#2f2f2f; font:11px/1.35em Verdana, Arial, Helvetica, sans-serif; }
@-->
{{template config_path="design/email/header"}}
{{inlinecss file="email-inline.css"}}
<table cellpadding="0" cellspacing="0" border="0">
    <tr>
        <td class="action-content">
            <h1 style="font-size:16px;">Dear {{var customerName}},</h1>
            <p style="font-size:14px;">Thankyou, For uploading your image in lifestyle gallery. Our team will review the image and you will be notify by email when your image will gets appove.</p>
        </td>
    </tr>
</table>
{{template config_path="design/email/footer"}} 

And Second email template is

<!--@subject LifeStyle Gallery Image Approved @-->
<!--@vars
{"var data.customerName":"Customer Name"}
@-->
{{template config_path="design/email/header"}}
{{inlinecss file="email-inline.css"}}
<div class="gallery_approved" style="padding:20px;">
    <div class="inner_body">
         <h1 style="font-size:16px;">Dear {{var customerName}},</h1>
       <p style="font-size:14px;">Congratulations, Your Lifestyle Gallery image has been approved. Please <a href="#" style="color:#000;">click here</a> to see your image.</p>
    </div>
</div>   
{{template config_path="design/email/footer"}}

Please tell me why this happening.

Answer 1

1. Create custom-email.css file in skin/frontend/{yourPackage}/{theme}/css/custom-email.css

2. go to Admin > System > Configuration > General > Design > Transactional Emails and add the email-custom.css to email-non-inline.css.Don't forget the comma.

3. add {{var non_inline_styles}} to your template email