📧Email Template Width Guide

Guide recommended email template content width by email client

Email ClientMin (px)Recommended (px)Max (px)Notes
Gmail (Web)600600640Scrollbar appears over 640px
Outlook 2016+600600600600px is the safe maximum
Apple Mail600600FluidSupports fluid widths on wide screens
Yahoo Mail600600640600–640px recommended
Gmail App (Android/iOS)320375600Renders at 100% device width
iOS Mail320375600Supports auto-responsive
Outlook App (Mobile)320375600Renders at device width

Safe content width for all clients: 600px. With 20px padding each side, content area = 560px.

Email Template Width Guide

HTML rendering varies significantly across email clients, which can break layouts. The universally safe maximum content width is 600px. With 20px padding on each side, the actual content area is 560px.

Outlook uses a limited rendering engine (based on Microsoft Word) that does not support Flexbox or CSS Grid. Table-based layouts are the safest approach. Use media queries to collapse multi-column layouts into single-column on mobile.

Buttons should be at least 44px tall for touch-friendliness. Include alt text on images and keep HTML file size under 102KB to avoid Gmail clipping.

Frequently Asked Questions

Why does Flexbox not work in Outlook?

Outlook uses an older Word-based rendering engine that does not support modern CSS. Table-based layouts are the safest alternative.

Should I use inline styles in email HTML?

Yes. Many clients strip styles from head style tags. Use inline styles or a CSS inliner tool to convert them.

What is the Gmail HTML file size limit?

Gmail clips HTML over 102KB. Host images externally and optimize your code to stay under this limit.