Versuchs doch mal selbst. Bau 3 SVG-Bereiche mit je einem "Haus" (Das ist schon der erste Unterschied: Du hast genau einen SVG-Bereich mit 3 Elementen). Die sollen skalierbar sein, durch die Zuweisung zu einer CSS-Klasse Farben erhalten und auf :hover reagieren. Mit der use-methode übernimmt Firefox in meinem fehlgeschlagenem Versuch stets die Farbe des ersten Symbols, Chromium findet keine und machts einfach schwarz. Firefox reagiert auf :hover, Chromium nicht. Und skalierbar sind die Dinger auch nicht. Der Effekt tritt auf wenn ich das gesamte <svg> importiere und wenn ich das <g> importiere. Also: was mach ich falsch?

Versuchs doch mal selbst. Bau 3 SVG-Bereiche mit je einem "Haus" (Das ist schon der erste Unterschied: Du hast genau einen SVG-Bereich). Die sollen skalierbar sein, durch die Zuweisung zu einer CSS-Klasse Farben erhalten und auf :hover reagieren. Mit der use-methode übernimmt Firefox in meinem fehlgeschlagenem Versuch stets die Farbe des ersten Symbols, Chromium findet keine und machts einfach schwarz. Firefox reagiert auf :hover, Chromium nicht. Und skalierbar sind die Dinger auch nicht. Der Effekt tritt auf wenn ich das gesamte <svg> importiere und wenn ich das <g> importiere. Also: was mach ich falsch?

Versuchs doch mal selbst. Bau 3 SVG-Bereiche mit je einem "Haus" (Das ist schon der erste Unterschied). Die sollen skalierbar sein, durch die Zuweisung zu einer CSS-Klasse Farben erhalten und auf :hover reagieren. Mit der use-methode übernimmt Firefox in meinem fehlgeschlagenem Versuch stets die Farbe des ersten Symbols, Chromium findet keine und machts einfach schwarz. Firefox reagiert auf :hover, Chromium nicht. Und skalierbar sind die Dinger auch nicht. Der Effekt tritt auf wenn ich das gesamte <svg> importiere und wenn ich das <g> importiere. Also: was mach ich falsch?