Rounded white box with border and drop shadow on coloured background

Hey

I'm working on an email template design that utilises a white panel, with rounded corners, that holds the email content. This rounded white panel has a drop shadow on the right and bottom of the panel and is centred on a grey background.

The template has, broadly speaking, a header, body and footer, and the body of the email will need to be flexible in height as it may contain different amounts of copy and images as new emails are generated from the template.

I have little experience in designing and coding html emails, so I'm not too sure how to set up the email as a whole, but particularly the sides of the email body. At the moment I'm thinking repeating images that accommodate the flexibility the template will need? But will repeating images in a <td> be ignored by Hotmail/Gmail?

So, any advice on the best way to set up the html for this kind of design would be hugely appreciated.

Thanks

roshodgekiss roshodgekiss, 5 years ago

Hi peter_b, welcome to the forums! My advice is to check out this email design from Panic. You will most probably find it to be a good starting point in terms of design and code for your own email template.


Get in touch with us on Twitter: http://twitter.com/campaignmonitor
We're also on Facebook: http://facebook.com/campaignmonitor

Join 200,000 companies around the world that use Campaign Monitor to run email marketing campaigns that deliver results for their business.

Get started for free
1-888-533-8098