Font-size In Html Email Via Gmail

Has anyone ever experienced a problem that, when a font-size style is applied to an element, the Gmail client isn't consistent when rendering? Example, I set the font-size to 17px

Solution 1:

Use pt instead of px for font-sizes, seem to work for me.

Solution 2:

Are you making e-mail templates?

Then you should use good-old-back-to-basics font tag:

<fontsize="2">text</font>

Solution 3:

Looks like they are overriding font-sizes and ignoring !important for text tags (a, p, etc)

When I applied the font-size to a wrapping <td> it worked fine.

Solution 4:

I faced this same issue today. I didn't find an answer on this thread that helped me personally.

However, I resolved it by surrounding all the ill-behaved text paras with a span that had inline style like this

<spanstyle="color:#613400;font-size:14px;font-weight:bold;font-family:Calibri,Helvetica, Arial, Sans-Serif;">TEXT</span>

I realised later that even when I give font-size:14px!important; font didn't stick to the visible 14px size (Browser's element inspector showed it was 14px!), and the reason was probably that font-family was set different for that ill-behaving text. When I added font-family selector to the span, things started working fine.

This same style when applied to or as a whole didn't work. What I found as a solution was that you should style all the text with span surrounding it.

Hope this helps someone who stumble on this thread!