5 ms·
What I like: it detects your browser and only sets the needed prefixes. What I don't like: it depends on JS. Using LESS or SASS avoids most of the problem thi
by bretthopper 15y ago
What I like: it detects your browser and only sets the needed prefixes.
What I don't like: it depends on JS.
Using LESS or SASS avoids most of the problem this article talks about it, although the generated CSS will contain every vendor prefix. I'm not sure the difference in CSS filesize is worth using this solution.
Does anyone know of a server-side solution like this? Wouldn't be hard to vary the CSS output based on user-agent. Although you'd lose some caching benefits.
- eam 15y agoI use Compass(http://compass-style.org http://compass-style.org) but that pretty much runs on SASS.
- yogsototh 15y agoI went here to make the same remark. Using compass you just have to type: +linear-gradient(color-stops(#c7def4,#d7eef4)) +box-shadow(rgba($ycolor9,.6) 0 0 4px inset) +border-radius() And it works really fine.
- jacobr 15y agoPerhaps it could be done as a SASS extension. You could use different mixins depending on the user agent.
- samgro 15y agoSASS @extend solves most of the code bloat - if you have lots of elements styled with border-radius: 5px, using @extend, the vendor prefixed code will only appear once in the compiled CSS. http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html#extend http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html#ex...
- jewel 15y agoI imagine that if the generated CSS is gzipped the vendor prefixes compress well, since they are quite repetitive.