https://github.com/tedgoas/responsive-email-xx
A few layout ideas for HTML email that adapt to small screens and respond to breakpoints.
https://github.com/tedgoas/responsive-email-xx
Last synced: 6 months ago
JSON representation
A few layout ideas for HTML email that adapt to small screens and respond to breakpoints.
- Host: GitHub
- URL: https://github.com/tedgoas/responsive-email-xx
- Owner: TedGoas
- License: mit
- Created: 2013-08-03T16:09:03.000Z (almost 13 years ago)
- Default Branch: main
- Last Pushed: 2021-01-27T00:03:53.000Z (over 5 years ago)
- Last Synced: 2025-02-01T01:52:32.510Z (over 1 year ago)
- Language: HTML
- Homepage: http://tedgoas.github.io/Responsive-Email-XX/
- Size: 46.9 KB
- Stars: 162
- Watchers: 20
- Forks: 40
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Responsive Layouts for Email
A few layout ideas for HTML email that adapt to small screens and respond to breakpoints. It also includes workarounds for a few HTML email gotchas in such as dodgy box model support in Hotmail, auto-detected links in Yahoo!, and background images in Outlook.
This template *is not* meant to be used out of the box. Any email derived from this code should always be tested.
## Demo
* [Demo](http://tedgoas.github.io/Responsive-Email-XX/)
## Tested In
* Webmail: Hotmail, Gmail, Yahoo!, AOL
* Desktop Mac: Apple Mail, Thunderbird, Outlook Mail
* Desktop Windows: Outlook (2007, 2010)
* iPhone (4, 4S, 5), iPod (Retina), iPad (1, 2, 3, Mini): iOS Mail, GMail
* Google Nexus (Android 4.3): Android Email, GMail
## Known Issues
* **Gmail** strips out the `` tag and displays only inline styles. Since this disables media queries, Gmail displays a shrunk version of the desktop layout.
## Tools and Resources
* [Guide to CSS Support](http://www.campaignmonitor.com/css) from Campaign Monitor.
* [Responsive Email Design Guide](www.campaignmonitor.com/guides/mobile/) from Campaign Monitor.
* [Antwort](https://github.com/InterNations/antwort) from InterNations.
* [HTML Email Boilerplate](http://htmlemailboilerplate.com/) from Sean Powell.
* [Bulletproof Email Background Images](http://emailbg.net/) from Stig Morten Myre.
* [Corporate Ipsum](http://cipsum.com/) by Cameron Brister
* [Placeholder Images](http://placehold.it/) by Brent Spore.
## Download, Fork, Commit.
If you can make this better, please download, fork, and submit a pull request. I'd love to work on this with a few folks and get it as solid as can be.