Skip to main content

I'm having trouble with emoji alignment in my email template. They appear left-aligned and detached from the text in my email client. Please see the attached screenshots for reference. Does anyone have any advice on how to correct this issue?

 

 

Hi @caitlinknoepp

Thanks for being a part of our community!

  • Gmail is known for not supporting certain CSS properties like vertical-align and can sometimes handle emojis in a quirky way (e.g., shifting them to the left or misaligning them within the text).
  • The drag-and-drop editor automatically inserts HTML and CSS into the email, and sometimes the generated HTML may not be as optimized for Gmail. Certain styling that works in other clients may break in Gmail, especially for inline elements like emojis.

To adjust for these nuances there are few options you could try: 

  • After building your email in the drag-and-drop editor, switch to the HTML editor and manually adjust the CSS for emojis, adding vertical-align: middle; if necessary. Here’s an example of adjusting the emoji HTML:
<span style="font-size: 24px; vertical-align: middle;">😊</span>
  • Use tables for layout control to align the emojis properly in Gmail
  • Check and adjust the font size and alignment settings within the editor, making sure emojis match the surrounding text

I hope this helps! 

~Chloe


Reply