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, 6 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, 6 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~

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