# [Antwort](http://internations.github.com/antwort)

### Responsive Layouts for Email
![Responsive Layouts for Email](http://internations.github.com/antwort/images/responsive-graphic-small.png "Responsive Layouts for Email")

Antwort offers responsive layouts for Email that both fits _and_ adapts to client widths. Don't underwhelm desktop users with single column layouts that work for mobile. Antwort offers columns on desktop that automatically become rows on mobile.

Author: Julie Ng ([@jng5](http://twitter.com/jng5))  
Date: January 2013  
Version: 0.1.2  

## Features
* Works on mobile: Mail on iOS and Email on Android.
* Works in major clients like Hotmail, Gmail, Yahoo! and AOL.
* Even works in Outlook (2000+).
* Bulletproof layouts: made with dynamic content in mind.
* Minimalist in design for maximum customizability.
* [More details on Antwort site »](http://internations.github.com/antwort/)

## How to use
1. [Read tips and coding style guidelines](http://internations.github.com/antwort).
2. Test with [Litmus](https://litmus.com/).
3. Send!

## Tools and Resources
* [Campaign Monitor's Guide to CSS Support](http://www.campaignmonitor.com/css) - reference table for CSS support in major email clients.
* [CSS Inliner Tool](http://beaker.mailchimp.com/inline-css) from MailChimp.
* [Premailer](http://premailer.dialect.ca/) another CSS inline tool. Also generates text version.
* [Litmus](http://www.litmus.com/) for testing Emails across clients.

## Changelog

### 0.1.2
* Fixed issue #8 - headlines no longer centered in Outlook.com and older Outlook.
* Fixed issue #7 - moved padding overrides to parent `<td>` in mobile styles.

### 0.1.1
* Fixed column margin issue after [Hotmail/Outlook dropped margin support](https://litmus.com/blog/hotmail-and-outlook-com-drop-support-for-margin).
* Issue #5 fixed - Outlook.com parses HTML tags in comments.
* Issue #3 fixed - control characters removed from template.
* Added screenshots of current version from Litmus test.
 

### 0.1.0
* Hello open source world.

## Demo
* Download and resize your browser window to see its responsiveness.
* [View demo screenshots](https://github.com/InterNations/antwort/blob/gh-pages/screenshots-litmus/) to see *how it looks* in various Email clients, including Android 2.3, Outlook 2000, Apple Mail, etc.

[!["Email Client Compatibility Preview"](http://internations.github.com/antwort/images/compatability-preview.png "Email Client Compatibility Preview")](https://github.com/InterNations/antwort/blob/gh-pages/screenshots-litmus/)

*Screenshots generated by [Litmus](http://www.litmus.com/). Last updated 26 March 2013 (v0.1.1)*

## License
Antwort is provided under the MIT License - see LICENSE.md for full details.