Loading...CSS3 is becoming increasingly popular among web designers as the browser support for it grows. But the vendor prefixes like -moz-border-radius, -webkit-animation etc. can be annoying at times. Many experts have been ranting about dropping these prefixes or to collapse all such vendor specific prefixes to a single prefix. Its evident that designers don’t feel like writing these prefixes to accomplish things, big or small. But the usage of prefixes is a very vital part of CSS. So, the best option would be to find a solution where one would be able to write functional CSS codes without using vendor specific prefixes. Therefore, Prefixfree tool can be a good solution.
PrefixFree is a tool that automatically detects the prefix of a browser one is currently viewing on and add the prefix where needed. The script processes all of the CSS on a page. PrefixFree lets you forget all the hassle of using vendor specific CSS prefixes and processes linked stylesheets, embedded stylesheets, inline styles as well as the CSS that is added afterwards. Another good thing about this script is that once a vendor drops their CSS prefixes, you can simply remove the script and your CSS code will still work fine.
PrefixFree also detects which properties need prefixing. The script can detect which properties are supported and the ones that are supported only with a prefix. Therefore, you won’t have to worry about browser as everything is based on feature detection. PrefixFree adds the prefix at runtime and therefore is much faster than other similar solutions.
There is also a testdrive section on PrefixFree’s site that allows you to test if the tool correctly adds prefixes to your CSS code. The tool works for both external stylesheets <link> and internal styles<style>. PrefixFree is indeed a useful lightweight tool that makes it easier for you to deal with CSS prefixes.