CSS3 Buttons Experiment
I like doing experiments like these as they help me to learn CSS3 and what can and can’t be done with it. Oh, and I only tested in recent browsers. It looks decent in the most recent version if IE, but I’m sure it probably looks like garbage on older versions so don’t even bother checking. I’ll be planning to update this set of buttons so keep an eye out on Twitter for some updates.
What do you think of the buttons? Feel free to use them if you want. Also, go ahead and share some of your own CSS3 experiments on the comments below.









Martti Laine
July 26th, 2011 3:23 pmLooks good but what about Opera support?
Jay Limcaco
July 27th, 2011 8:42 amYou’re right. Completely forgot about that. Yeah, I guess I can add those prefixes to the CSS :)
Brad
August 7th, 2011 5:49 pmTry this, it will add all vendor prefixes to your CSS files for you. Will do much more too
http://prefixr.com/
Tutorial:
http://net.tutsplus.com/articles/news/cross-browser-css-in-seconds-with-prefixr/
Pablinho
July 26th, 2011 7:29 pmVery neat.
Tried opening the page in IE7 and IE8, and as you said, they look awful. Nice try though. Will try to dissect the code laters to see what new tricks i can use.
As per Opera, isnt it well below 1% usage ? Even IE6 has still a bigger share than that.
Thanks
Martti Laine
July 26th, 2011 10:51 pmOpera holds a rough 2-3 percent of browser usage, and I don’t really see a reason to not add another browser prefix, as there already are 2 of them (besides, I personally am 100% against prefixes at all). Plus, Opera doesn’t need prefixes for shadows for example.
To my knowledge, IE6 has its share mainly because of large, oldish companies (mostly in Asia) not seeming to update. Probably people who are interested in experiencing the graphical appearance of a website have a newer browser.
Jay Limcaco
July 27th, 2011 8:44 amYeah, IE6 does have a larger market share than Opera but I could care less about supporting IE6 now.
Spyros Rallis
July 27th, 2011 12:49 amNo problem with old browsers at all, since any CSS3 styling will just get ignored by browsers that cannot interpret it.
Surely it won’t look good in IE6 for example, but it won’t look broken either. ;-)
Jay Limcaco
July 27th, 2011 8:45 amYes, you’re right. I checked it out in IE7 and it’s still usable. As long as it looks good in modern browsers.
Jay Limcaco
July 27th, 2011 8:49 amJust found these CSS3 buttons as well. Looks good!
http://hellohappy.org/css3-buttons/
Erwin
July 30th, 2011 3:11 amJust found these CSS3 buttons.
Good work, i will implement the RED one in my Google+ WordPress theme.
Thanks. Greetings from The Netherlands.
viktor
August 3rd, 2011 3:06 amHey, I’m new on web design/development and obviously CSS3. Where is actually the CSS3 code for these buttons?
web2dev
August 7th, 2011 7:10 pmHi ,
Looks good :)
my own : http://jsfiddle.net/webdev/MKf9w/
Justin Nguyen
August 8th, 2011 3:44 pmI also like CSS3 because it’s new. But some one tell me that CSS3 make their PC slowdown. LOL
Johan
November 18th, 2011 2:31 pmFor the older IE browsers I can highly recommend you look at the PIE.htc ~ for the answer.
Great job on the buttons.