How to adapt media queries for iPhone 6 and 6+

Are you setting your emails to a hard pixel width with your media queries?

I assume your question then is to what pixel width is the landscape view of iPhone6 and iPhone 6+ ? I would be interested to know...running tests in the meantime now!

Hey James!

We did a full writeup on the iPhone 6 and iPhone 6 Plus on the Litmus blog which covers everything in detail.

iPhone 6 (Zoom View):

@media screen and (max-device-width: 320px) and (max-device-height: 568px) { /* Insert styles here */ }

iPhone 6 (Standard View) and iPhone 6 Plus (Zoom View):

@media screen and (max-device-width: 375px) and (max-device-height: 667px) { /* Insert styles here */ }

iPhone 6 Plus (Standard View):

@media screen and (max-device-width: 414px) and (max-device-height: 776px) { /* Insert styles here */ }

*Note: You'll need to include max-width in the media query statement if you want the email to be responsive on desktop as well.

Basically, just note that the iPhone 6 (Standard) is 375px wide and iPhone 6 Plus (Standard) is 414px wide. Those are the two new breakpoints you should be aware of.