Browsers & Vendor Prefixes - The Correct Prefixes Made Easy!
Posted 16th February 2013 at 08:32 PM by David V
If you write your code for the best browser support or are just trying your hand at this,
I'm going to show you a few tools that will make the tedious task of hand writing these super simple and easy.
Ok, so maybe your wondering "what the hell is a vendor prefix"?
If you've ever peaked into some css stylesheets or looked at a websites coding with Firebug, you've might have seen something like this:
Writing this by hand is prone to errors and a huge pain in the backside.Code:.box_gradient { background-color: #444444; background-image: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#999999)); /* Chrome, Safari 4+ */ background-image: -webkit-linear-gradient(top, #444444, #999999); /* Chrome 10-25, iOS 5+, Safari 5.1+ */ background-image: -moz-linear-gradient(top, #444444, #999999); /* Firefox 3.6-15 */ background-image: -o-linear-gradient(top, #444444, #999999); /* Opera 11.10-12.00 */ background-image: linear-gradient(to bottom, #444444, #999999); /* Chrome 26, Firefox 16+, IE 10+, Opera 12.50+ */ }
So, let's make this easier, faster, and ensure our vendor prefixes are updated.
Here's a cool list of tools that will create the prefixes for you, or at the very least aid you in getting the job done accurately and fast!
I hope you find one of these useful. They will save you a lot of time!
Total Comments 0