HTML emails – zooming in on Android (fine on most iPhones)

[counterfoxx]

I have been writing my first HTML email template with tables. I am just trying to get it to fit to screen on mobile devices.

When I have checked on Android the email is always initially zoomed in and the user needs to pinch it out to get it to fit the screen size. The same happens on the iPhone 6 but the older versions of iPhone display fine.

I tried adding this inline style:

style='width:100%; min-width:600px;'

But it doesn’t make a difference. I have also tried this:

<meta name="viewport" content="width=device-width, initial-scale=1.0 />

Any help to make the email fit to screen on Android and iPhone 6 is much appreciated.

[Senff]

HTML emails are still a b–ch to work with, and mobile’s only making it more difficult.

Personally I still set a fixed width of 600px and I don’t use a meta tag (but in all honesty, I haven’t done many of these emails lately).

I do think you want to set a MAX width of 600 though, not a MIN width.

More reading material: http://webdesign.tutsplus.com/articles/creating-a-simple-responsive-html-email–webdesign-12978

[Author]

Posts