0

I am trying to use Zurb's Ink to build responsive HTML emails but I am still seeing the large layouts on both desktop monitors and mobile devices. The layouts are responsive in the browser but within the email client on both desktop and my phone I am only seeing the large layout of the email. I guess my questions about this is, am I supposed to be seeing the mobile view of the HTML email on mobile device's email and the larger layout on my desktop email? I know email clients are supposed to read media queries so I am bit confused about what his framework is supposed to do. I am using "the send page as email" option from IE within parallels on my desktop machine to send the email and I am not using MailChimp or CampaignMonitor, so is this the problem? I guess I assumed I would see the single column layout of the template from gmail on my phone and the multi-column layout in gmail on my desktop. I'm probably not understanding something basic here but was jw if anyone had any insight.

Thanks.

cpwynn
  • 23
  • 1
  • 7

1 Answers1

0

Gmail does not support media queries (or the style tag). It only supports inlined CSS.

If you want Gmail support, try a fluid template instead of a responsive one. I have a few of them listed here

Community
  • 1
  • 1
John
  • 11,985
  • 3
  • 45
  • 60
  • Ya, I'm aware that email clients don't support media-queries. That;s why I was confused about this "responsive email template". It seems like the only way that it would be truly responsive is if you posted a link in the email and let the recipient view the link in their browser. Which would make this just a "responsive page template". http://zurb.com/ink/ – cpwynn Feb 04 '14 at 17:02
  • It is responsive, just that [responsive doesn't have 100% client support](http://stylecampaign.com/blog/2012/10/responsive-email-support/). A lot of people choose to design for the best case scenario and rely on graceful fallbacks for those unsupported clients. Personally I prefer a consistent design that is 100% supported in all clients. IMHO Fluid is the way to go, especially because a single-column design is usually better for UX anyway. – John Feb 04 '14 at 18:10