Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member
This video shows common problems you might encounter when you send an HTML email to Gmail, along with solutions. The primary issue with Gmail is simply that it only responds to inline CSS. You cannot have CSS outside of any HTML table tag, td tag, or paragraph tag, image tag, anchor tag, and so forth. Gmail will ignore all other definitions of CSS, unless it is in an HTML tag. The three issues related to Gmail have to do with background images on tables and table data cells, font sizes, and font colors.
Let's look at solutions for each of these, starting with fonts. When you test your HTML email in Gmail, what you might find is that if you have a dark background for example, and your color is not coming out, if it's too dark, one solution is to simply force the font color. In this case, we are specifying white. You nest the font tags inside of your anchor tags to make everything crystal clear to Gmail as it displays your email.
In addition, if you have a problem with the font size and you cannot correct it with a style declaration, you also can use the size= value in the font tag. So this is how you can adjust, or force, the color and the size of a font in Gmail if you need to. If you don't force the font color, you should always define the color of your links, just to be sure.
To display background images in Gmail, I'll explain this solution published in the Campaign Monitor blog. The URLs are at the top of the exercise file. A solution for Gmail uses the background= property. We also have code here for Microsoft Office, which is VML. You can find the latest on Gmail compatibility with CSS at this Campaign Monitor CSS support page.
Get unlimited access to all courses for just $25/month.Become a member
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.
Your file was successfully uploaded.