Gmail – How to Fix Font Size in Email Signature

email-signaturegmailgmail-text-editor

The font size of my Gmail signature looks weird — it sometimes changes even in mid-sentence, and this is only visible outside Gmail, e.g. in the Inbox app on my iPhone. How to fix?

Best Answer

Step 1

An optional diagnostic step, just so you can see what's going on. Send yourself a test email and look at it on your iPhone (or through whatever email reader your emails/signatures tend to look weird on). If it does indeed look weird, open it in Gmail on a desktop/laptop; click the menu next to the reply icon, and you'll see a list of options including "Show original". Peer at the HTML code and you should see that some of the tags (like <div style="...etc.">) break up the writing.

Step 2

These instructions are for Chrome. Instructions for other browsers shouldn't be hard to figure out.

To fix, go to the text input where you typically edit your signature and pull up the text of your signature in there. Go to View > Developer > Developer Tools. Hover your mouse over the topleftmost button and confirm it says "Select an element in the page to inspect it." (If this screen is too small, click the toprightmost button, then the icon that says "undock into separate window" when you hover your mouse over it.) Click the "select an element" button, then click on the text input where you enter your signature.

The DeveloperTools window should now become visible, and you should now see some HTML including a line that begins <div class="gmail_signature">.

Step 3

Two methods:

Step 3a

Hard method: Right click (or control-click) on this line, and click "Edit as HTML". You are now editing your signature as HTML. To make the appearance consistent, one thing you could do is to make sure that each <div> contains a <span style="font-size:12.8px">.

Step 3b

Easy method: You should see lines saying <div> or <div dir="ltr">, and the most-indented lines might begin <span. (Click on the little arrows to show deeper indent levels.) Make sure the most-indented <div> lines just match this pattern: <span style="font-size:12.8px">[some text here]</span>. To fix HTML, right click (or control click) a line and click Edit as HTML, then when you're done click outside that text input that opened up.

When you're done, click "save changes" at the bottom of the Gmail settings page. If the "save changes" button is not clickable, go to the signature editor input, add a space to the end, then remove that space. That should make the button clickable again.

Then send yourself a test email, and use step 1 to figure out how to check out whether the HTML is being generated correctly.

Good luck!