Positioning SVG elements using CSS

Question

Assume the following svg document:

Answer 1

At the moment, it seems -according to Shelley Powers, in her A List Apart Article "Using SVG for Flexible, Scalable and Fun Backgrounds: Part I" and "Part II"- that CSS is not currently best-suited to positioning of SVG. In fact it seems to be quite a minefield to incorporate SVG into a web-page, without directly embedding it within the html itself.

I hope that there are solutions to be found, and, indeed, Powers does offer a couple of workarounds, to enable proper separation of style and content for SVG. I'd hazard a guess that the current problems are the relative new-ness of the concept/standard (relative to, for example, .gif or even .png...), sadly.

I'm sorry I can't offer a better answer. =/