CSS3 is the coolest thing to happen to web design in a long, long time. With all of its incredible new properties,
transform to name just a few, a new dawn has arrived, and opened up a multitude of powerful and exciting options that have refreshed the web design community as a whole. Yes, we do love it!
Not everybody loves it, well, not as yet, anyway. They, of course, is Internet Explorer, and as you will probably know, they are trying to love it, albeit very slowly. Until they are ready, we can either not support IE at all, and just allow our visitors to enjoy the CSS3 experience through Safari, Chrome and Firefox, or you could use some of the tools we have in this article and beat IE into submission and support CSS3.
The Designer & Developer Toolbox
Unlimited Downloads: 1,000,000+ Web Templates, Themes, Plugins & Design Assets
Transformie is a tiny (5kb) jQuery plugin that you can embed into web pages that renders CSS Transforms by mapping the native IE Filter API to the CSS transitions as proposed by Webkit.
3 Pie (download) is a set of CSS “behaviors” that can be attached to any CSS file by way of the behavior element in order to add rendering support to Internet Explorer 6, 7 or 8 for the more popular CSS3 rendering features:
border-image; multiple background images;
linear-gradient as background image.
box-shadow and others. This script is not only useful for developers who want to support CSS3, it is also useful in other browsers which implement their own vendor-specific variants of these properties.
Modernizr uses feature detection to test the current browser against upcoming features like rgba(), border-radius, CSS Transitions and many more. These are currently being implemented across browsers and with Modernizr you can start using them right now, with an easy way to control the fallbacks for browsers (i.e.,. IE) that don’t yet support them.
YUI also works well with mobile browsers that are based on A-Grade browser foundations. For example, Nokia's N-series phones, including the N95, use a browser based on Webkit.
eCSStender enables developers to patch CSS support in browsers and experiment with new features. It also enables designers to keep browser-specific hacks out of their CSS files.
52Framework – HTML5 and CSS3 Framework
The 52framework provides an easy way to get started using HTML5 and CSS while still supporting all modern browsers (including ie6).
CSS3, Please! is a small utility that allows you to edit the document in real-time and create your own personalised cross browser CSS3 rule.
CSS3 Support in Internet Explorer 6, 7, and 8 (.htc)
IE-CSS3 is an .htc (HTML component file ) script that provides Internet Explorer support for some new styles available in the upcoming CSS3 standard. This script rebuilds some of the elements in Vector Markup Language (VML), an IE-specific vector drawing language. VML supports things that are missing from IE's CSS implementation like rounded corners and blur effects.
This is a behavior .htc file for Internet Explorer to make the CSS3 property " border-radius " work on all browsers.
It will allow you to start using open web technologies – like HTML5 and CSS3 – right away, even technologies that aren't yet supported in Internet Explorer 6, 7, or 8.
CSS3 Compatabilty Reference & Utilities
When can I use… is a compatibility table for features in HTML5, CSS3, SVG and other up and coming web technologies.
FindMeByIP – CSS3 Properties
If your Web site targets browsers that include earlier versions of Internet Explorer, you want to know the level of CSS compliance for those versions. This article provides an at-a-glance look at CSS compliance across recent versions of Internet Explorer, including support in Internet Explorer 8.
Interested in checking out the new web platform capabilities of the forthcoming Internet Explorer 9? You can try the Internet Explorer Platform Preview It includes HTML5 & CSS3 demos and speed demos.
- On the Downlow(res): A Showcase of CSS Pixel Art
- 10 Modern Examples of Slide-Out Sidebars
- 10 Creative Code Examples of Media Player Design
- Fun Examples of CSS Imitating Print Design
- Forge Your Own (Animation) Path with These Snippets
- 12 Free Modal Window Libraries & Plugins For Your Site