This website is currently in maintenance mode for updates.
We apologize for any inconvenience this may cause and appreciate your patience while we perform this procedure.

How to add CSS styles

When you code a HTML email, there are certain steps that you must follow in order to streamline your work: planning the design, creating it and adding content. Finally, you also have to add CSS styles in order to give your email the customized aspect that is representative for your business activity. The HTML tables are meant to hold your design together but there is a lot of styling that needs to be done before you get the final result. You must work on each and every area of your design, be it a logo, a copy or an explore link. When you set up the table layout in HTML, you put each of these elements as a table within a larger data table cell.

All you have to do is define their styles by setting the color of the font, the font family, size, width as well as the margin and padding values. In addition to the explore links, you also must define the paragraph style for each and every of them. When it comes to the footer, you follow the same process, adding adequate styles for each box.

Here you have an example for the CSS styles in the footer area:

<!-- footer table-->
<table border=”0” cellpadding=”0” cellspacing=”10”bgcolor=”#2e576b” width=”545”
   <tbody>
       <tr>
          <td align=”left” width=”90” height=”90” valign=”top” style=“background-color:transparent;color:#ffffff;margin-left:0;margin-right:0; padding-left:0;padding-right:0;margin-top:0;margin-bottom:0;padding-top:0;padding-bottom:0;”>
              <p style=”color”:#ffffff;font-family:Arial,Helvetica,sans-serif;font-size:10px;margin-left:0; margin-right:0;padding-left:0;padding-right:0;margin-top:0;margin-bottom:0;padding-top:0; padding-bottom:0;”>
                <a style=”color”:#ffffff;text-decoration:none;” href=”” target=”_blank”>content</a>
              </p>
          </td>
       </tr>
   </tbody>
</table>