CSS Google-style buttons

I'd love to move away from buttons that are either a) plain HTML text link (not as obvious as a graphic) or b) a .gif/.jpg (could be blocked altogether) and move towards a convenient marriage of the two, somewhat like Google's efforts with their CSS button designs.

http://stopdesign.com/archive/2009/02/04/recreating-the-button.html

Regrettably a few of the CSS elements (such as background-position or background) they've used aren't enabled in some email clients, so I thought I'd ask some HTML email gurus the question:

Has anyone found some elegant CSS button design methods which at least degrade nicely when an email client doesn't support some of the elements?

Mathew Mathew, 7 years ago

We've not seen anyone do too much in that area, but we'd recommend checking out Panic's work for some inspiration: http://www.campaignmonitor.com/blog/post/3116/what-you-can-learn-from-panics-email-marketing/


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

Thanks for the pointer, Matthew. I did check out that blog post both when it was new, and also after seeing your reply. Panic's work is certainly inspiring, and looks/works great in webkit, but gentle degradation for other clients is key for me (regrettably).

I'm back to the multi-email-client drawing board~

200,000 companies around the world can't be wrong.

From Australia to Zimbabwe, and everywhere in between, companies count on 
Campaign Monitor for email campaigns that drive real business results.

Get started for free
1-888-533-8098