SVG as data URI not rendering
It's probably just a Syntax error but I can't find any thorough references on this kind of usage. Chrome is overstriking my background property, so I've obviously offended something.
I want what's in the red box (an svg css background) to render just like the inline svg in the html. Simple, right?
Don't say it can't be done! My inspiration is this: http://jsfiddle.net/estelle/SJjJb/
You haven't escaped the '#' characters in the url() syntax. And it's 'viewBox' not 'viewbox'.
Here's something that works: http://jsfiddle.net/YbA39/3/ (just a quick urlescaped string).
This post first appeared on CSS3 Recipes - The Solution To All Your Style Problems, please read the originial post: here