Antwort - responsive Email Layout

The world scouts at us whale hunters

Image Caption Herman Melville
It's worse than being in the whirled woods, the last day of the year! Who'd go climbing after chestnuts now? But there they go, all cursing, and here I don't.
Image Caption Herman Melville
Fine prospects to 'em; they're on the road to heaven. Hold on hard! Jimmini, what a squall! But those chaps there are worse yet—they are your…
Image Caption I am Ishmael
White squalls? white whale, shirr! shirr! Here have I heard all their chat just now, and the white whale—shirr! shirr!—but spoken of once! and…

How it works

You should view the source code to see how this works. If you're struggling, here's a bit more documentation

Markup contains:
  • A container table with 3 columns
  • Wrapper tables with one cell inside each column
Manipulating the layout means:
  • Forcing container columns to (horizontal) blocks
  • Unset paddings and alignment in inner tables
  • Float image to the right
Why do you need inner wrapper tables?
  • The last column needs to float to the right edge, via align="right".
  • Clears floated images in mobile versions.

Slightly less than 600px
Your columns and container table probably will add up slightly less than 600px to work in Outlook. How much less? Only testing, trial and error, and real content will tell you what that magic number is.

N.B. This copy is simple HTML and probably won't render 100% in an email client as you see it in a browser. It's meant as documentation, not part of the template.

Make a free website with Yola