svg - 基于每次使用的SVG符号样式

如http://jsfiddle.net/xMnea/4/所示，我定义了一个包含多个元素的符号，每个元素都有自己的类属性。在主体中，我多次使用符号。我使用内嵌CSS来单独设置每个用途的样式。

在Firefox 15中，这可以正常工作，但在IE9和Chrome中，我得到黑色正方形。似乎后一种浏览器不检测/识别符号中的类定义。如果结构是直线的（右下方），它们按预期工作。

这仅仅是Firefox比其他人更合规的情况，还是有更好的方法来实现SVG元素的重用，同时允许个性化样式？

额外信息：如果我使用“defs”而不是符号，或者如果我使用外部样式表而不是内联，则会出现同样的问题。