SPD - HTML Emails w/ CSS

Question

I've downloaded an HTML template from here http://www.campaignmonitor.com/templates/ and didn't touch the css or any of the parent nodes of the document for that matter. I just sent it as is through a workflow email and the shows up in clear text and doesn't even get applied to the email. This has happened for my Outlook 2007, web: gmail and hotmail. Is there something different that I have to do other than this markup?

Product Development Team Notification body { background-color: #474333; margin: 0; padding: 0; }

     <table width="579" border="0" cellspacing="0" cellpadding="0">
        <tr>
           <td class="permission">
              <p>You're receiving this newsletter because you submitted an idea to the Product Development Team.</p>

           </td>
        </tr>
     </table>

     <table width="579" border="0" cellspacing="0" cellpadding="0" class="bgTop">

        <tr>
           <td align="center">

              <table width="579" height="108" border="0" cellspacing="0" cellpadding="0" class="header">


                 <tr>
                    <td><img src="http://URLtomylogo.jpg" width="579" height="108" alt="Logo"/> </td>


                 </tr>
              </table>

           </td>
        </tr>
     </table>

     <table width="579" border="0" cellspacing="0" cellpadding="0" class="bg">

        <tr>
           <td width="100%" align="center" valign="top">
              <table width="530" border="0" cellspacing="0" cellpadding="0">

                 <tr>
                    <td align="left" class="mainbar">

                       <h3>Featured Item:</h3>

                       <h2>[%title%]</h2>
                       <p>[%status%]                         
                    </td>
                 </tr>
              </table>

           </td>
        </tr>
     </table>

     <table width="579" height="108" border="0" cellspacing="0" cellpadding="0" class="bgBottom">


        <tr>
           <td align="center">

              <table width="559" height="88" border="0" cellspacing="0" cellpadding="0" class="footer">

                 <tr>
                    <td align="center">Footer</td>
                 </tr>
              </table>

           </td>
        </tr>
     </table>

  </td>    </tr> </table>

Answer 1

Ugh... I found the answer but it's a reallllly lame one.

http://office.microsoft.com/en-us/sharepoint-designer-help/send-e-mail-in-a-workflow-HA010239042.aspx

"Because the Workflow Designer supports only inline styles for formatting messages, and not external or embedded cascading style sheet (CSS) formatting, you must do any formatting that you want by using the style attribute with HTML tags." Whatever /facepalm

Answer 2

Although this question is old, I will add the following for completeness.

Since SharePoint Designer composes html email, and css can be embedded in html, this should be doable.

SPD seems to replace all newlines with
tags. If you have newlines in your CSS those will be replaced too, and you don't want
tags in your css.

I wrote my CSS all on one line and it works.

Answer 3

It's not just your CSS that is affected. Even using the Advanced Properties fields, SPD will add an HTML
tag after every new line (whether hard or soft return).

This is just another oversight that could have been VERY easily rectified several versions ago.

Now that GUI support has been pulled, maybe the SPD team will have more time on their hands. ;)