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).