A set of simple CSS3 buttons

A set of simple CSS3 buttons

Having searched around for a while, looking for a set of CSS3 ‘buttons’ and not finding anything exactly right for my needs, I decided to create a set from scratch. Being the generous kind of bloke I am, I though that I’d share them here in case any other frustrated web workers are in desperate need of a button fix.

As you probably already know CSS3 support isn’t exactly ubiquitous at this stage (especially for things like linear gradients I used here) so these buttons are going to degrade in older browsers (I’m looking at you IE). Whether that stops you putting them into production is obviously up to you, they look okay when degraded (and I could probably have made them look better if I had a need to) but for the purpose they were created for there was really no need.

What this little exercise did throw up however is exactly how poor the support for CSS3 is in IE9. How Microsoft can justify their attempt to develop a ‘standards compliant’ browser and do it so poorly is beyond my understanding.

10 comments on A set of simple CSS3 buttons

  1. Zack says:

    Great stuff, Joe! I would be honored if you coded some of our freebies. =) Keep it up!!

  2. Joe says:

    I’ll be sure to check out your site and see if there’s anything I can knock up! :)

  3. Zack says:

    Sweet deal! Thanks again!

  4. Pingback: Downgraf | Design weblog for designers » Example of beautiful CSS3 buttons with code

  5. RvDesignsf says:

    Nice set of css3 buttons thanks

  6. Pingback: 20 More CSS3 Tutorials and Techniques for Creating Buttons

  7. Pingback: 20 More CSS3 Tutorials and Techniques for Creating Buttons « CSS Tips

  8. Pingback: 20 More CSS3 Tutorials and Techniques for Buttons | Information Square

  9. Pingback: CSS3, Tutorials and Techniques for Creating Buttons | Web Help 101

  10. Pingback: CSS3按钮教程

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>