Button padding not working in Gmail (but ok in Outlook...?)

  • 28 January 2022
  • 2 replies

Badge +2

Can’t seem to get the button block to display correctly in Gmail.

Displays correctly in the previewer & in Outlook (both outlook for Mac v16.57 & on the web), but loses padding in Gmail.

Anyone else had this issue?





Best answer by David To 28 January 2022, 17:57

View original

2 replies

Userlevel 7
Badge +60

Hello @jamin93,

That’s certainly an odd behavior! Typically we see more rendering issues on Outlook rather than Gmail based on Outlook’s rendering engine

From your screenshots, it appears that the Gmail version of the email seems to be rendering as a URL link with a background rather than an actual button. Note how the “Order Now” phrase is blue rather than white and the background does not match that of the preview version, gray versus dark bluish gray. Do you happen to be previewing on separate devices such as Outlook on a desktop while Gmail on mobile? I’m wondering if you may potentially have two separate blocks, one for desktop and one for mobile which is causing these two separate views. 

If this was not the case, I’ve also seen some instances where templates can be corrupted causing some inconsistencies in how they render. Most notably, corruption can occur if you’ve previously cloned this template from another. To resolve this, I would suggest recreating the template from scratch or alternatively just recreating the part of the template which is rendering incorrectly; in this case that particular button. When you’re recreating this button, it’s also a good idea to add in the button text and button URL/link without any formatting if you were copying and pasting into these fields.

I hope this helps!


Badge +2

Hi David,

Have been viewing both emails on the same device.

I’ll try starting with a new template to see if mine has been corrupted.

Thanks for your help,