Updates to the CSS3 buttons

I’ve made a few key updates to the Sexy CSS Buttons.  Namely, I’ve added transitions for Mozilla (-moz-transition, introduced in Firefox 3.7) and Opera (-o-transition, introduced in Opera 10.50).  I don’t plan on updating the original post,  but I will sum up the changes here.

Instead of just having the -webkit-transition block in input[type=button], button, we now have three blocks:

-webkit-transition: background-color 0.2s ease-in-out,
    color 0.2s ease-in-out,
    -webkit-box-shadow 0.2s ease-in-out;
-moz-transition: background-color 0.2s ease-in-out,
    color 0.2s ease-in-out,
    -moz-box-shadow 0.2s ease-in-out;
-o-transition: background-color 0.2s ease-in-out,
    color 0.2s ease-in-out,
    box-shadow 0.2s ease-in-out;

We will also need to update the transition duration for the click state, input[type=button]:active, button:active:

-webkit-transition-duration: 0.0s;
-moz-transition-duration: 0.0s;
-o-transition-duration: 0.0s;

And now your buttons are ready for Mozilla and Opera transitions!