SHARE

cssfx.js downloadOne of the most annoying part of CSS3 is adding vendor/browser specific properties manually is css file. In order to make the design appear correctly in all browser, developers are forced to add -webkit-, -moz-, -o- in their design for different browsers. This work is time consuming as well as adding 4-5 lines of extra codes in each css increases the size of css file as well.

Solution : Automatically generate vendor specific CSS3

Luckily, there is a tiny script named CSSfx.js hosted is github that automatically generates required browser specific css3 on the client-side. This saves you lots of time, maintenance, and bandwidth and this script is only 2. 3kb! CssFx supports most of the CSS3 properties and has support even for IE6.

automatically generated browser / vendor specific css3 properties
Automatically generated browser / vendor specific css3 properties by cssfx.js.

What features are supported?

CSSFx supports almost all css3 properties such as box shadows, border radius, multiple columns, border image, RGBA, transforms, keyframes, transitions (and properties inside transitions), flexible box, gradients, and a ton of other useful things (like opacity, ellipsis, and inline-block).

Which browsers are supported?

It works on all major new and old browser even Internet Explorer 6 is supported. Minimum browser requirement : Firefox 3+, Chrome 1+, Internet Explorer 6+, Safari 3+, Opera 9+.

How do I use it?

Include the JS file, and give external stylesheets the “cssfx” class, that all. Example;

<link rel="stylesheet" href="yourstylesheet.css"> <script src="cssfx.min.js"></script>

You can download cssfx.js from the CssFx.js project hosted on Github.