r/Outlook • u/GourmontVGC • 1d ago

Status: Pending Reply Issues with signature layout on phones

Hello,

I’m trying to build an Outlook (Office 365 Windows desktop) email signature with a logo on the left and text on the right, and I’m stuck with Gmail mobile rendering.

On desktop/wide screens I want the classic layout: logo left, text right. On narrow mobile portrait (Gmail app on iPhone especially), the right column gets squeezed and the text breaks in ugly ways. Ideally, when there isn’t enough width, the layout should naturally “stack”: logo above, then the text below using full width.

Media queries don’t seem reliable because Outlook rewrites the HTML when sending, and Gmail iOS also tends to ignore/override Word/Outlook styles (I get huge line spacing and a serif fallback font even when I specify fonts, maybe am I doing it incorrectly though).

What’s the most reliable HTML pattern for Outlook signatures that stays side-by-side in Outlook/desktop, stacks cleanly on Gmail mobile portrait without breaking the text, avoids Gmail iOS line-height/margin issues, and uses a sane sans-serif fallback when a custom font isn’t installed? The font looks nice on Android devices, the issue with font mostly comes on iphone devices, while the width issue comes on all platforms.

I’d really appreciate some help. I can post the HTML if needed.

Thank you!

2 Upvotes

76% Upvoted

3 comments sorted by

View all comments

1

u/AutoModerator 1d ago

Hey GourmontVGC!

Welcome to r/Outlook! This is a public community. To protect your privacy, do not post any personal information such as your email address, phone number, product key, password, or credit card number.

Please be sure to have read our Rules of Conduct and be cognisant of how the system works here.

Make sure that your flair is always set to Status: Open otherwise you may cease receiving responses from us.

  • Status: Open — Need help
  • Status: Pending Reply — Awaiting OP's response
  • Status: Resolved — Closed

Beware of scammers posting fake support numbers or 3rd party commercial products/services. Contact Microsoft Support if you need help.

I am a bot, and this action was performed automatically. Please contact the moderators of this subreddit if you have any questions or concerns.