Finally got my new buttons today :)
| Permalink | naioo Buttons |
| Date | 07/19/11 |
| Categories | News |
| Tags | buttons / naioo / print |
In a previous post, I talked about creating dynamic and scaleable buttons using CSS3. While we can use “border-radius” for rounded corners and “box-shadow” for a nice dropshadow effect, there’s still a problem with giving the button a 3d / plastic look without using images. In my previous example I used a small PNG image (with a gradient from white to transparent) as a background to achieve that effect.
Now, with the release of Firefox 3.6 (Safari / Webkit supported that a bit earlier) we don’t need any images at all, thanks to the “moz-linear-gradient” / “webkit-gradient” property.
Creating buttons with CSS becomes a lot more comfortable. The following example demonstrates how to create nice looking, dynamic buttons that are fully scaleable using the new CSS3 properties border-radius, box-shadow and RGBa.
Featured
Recent Tweets
- @timsilva i try to do some more stuff in the future again, but time is always rare :)
- New Wallpaper! Part of the Smashing Magazine Wallpaper Calendar May 2012. http://t.co/aaIPOpMP
- http://t.co/jYA7rCR0
- The card deck prints arrived today! Here's a first shot taken with my phone. More HQ images and details within... http://t.co/EgrU5AZ1
- @KamiKa_SR like a boss