How to add CSS styles

In order to achieve your goals with your multi-column HTML email design, you need you add CSS styles inline. This is the last step of the entire process but a very important one so you should start with your navigation links. These are made up of a single HTML paragraph that surrounds several anchor tags so you start by styling your paragraph tag and you define the color, the font family, font size and font height. Then you have the typical margin and padding settings to 0. In addition, you should set the text alignment to “center” so that the navigation links center within that area of the HTML email. For each link you must set the color to white, to align it in the center and you set the margin right to a certain number of px and the text decoration to none. You should remember that with HTML email you cannot set code to have links underlined or not. Unlike web pages, here you have the choice either using underlines or not.

The second part of the HTML email that relates to CSS styles are colors. The original email design typically has several colors used for the copy so you have to style each area, starting with the heading. The product names and their prices must be styled too and given that they are wrapped in a single paragraph tag, you should define the color of the product name at the paragraph level. You define the color, the font family, font size, fond width, you set the line height, the margin, the padding and the text alignment. These inline CSS styles must be added to each one of the products. In addition to coloring the heading, the tag line, each of the product names and each of the prices, you also need to color all the other elements of the promotional offer. The last bit of coloring has to do with the background color behind the email so you have to add CSS styles within the pseudo body table.