Шаблон SVG не виден только в Firefox

Question

Мой шаблон в Firefox не виден:

Верх: Chrome

Низ: Firefox

Код SVG (но, пожалуйста, немного вниз, чтобы увидеть изображение)

    <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" enable-background="new 0 0 120 120" version="1.1" viewBox="0 0 120 120" xml:space="preserve">
    <style type="text/css">
    	.st0{fill:none;}
    	.st1{opacity:0.48;}
    	.st2{fill:#FFF99A;}
    	.st5{fill:url(#a);stroke:#007BFF;stroke-width:0.5;stroke-miterlimit:10;}
    </style>
    <pattern id="b" y="120" width="200" height="200" overflow="visible" patternUnits="userSpaceOnUse" viewBox="0 -200 200 200">
    		<rect class="st0" y="-200" width="200" height="200"/>
    		<rect class="st0" y="-200" width="200" height="200"/>
    		<g class="st1">
    			<rect class="st2" y="-100" width="200" height="100"/>
    		</g>
    		<g class="st1">
    			<rect class="st2" x="100" y="-200" width="100" height="200"/>
    		</g>
    </pattern>
    	
    <pattern id="a" xlink:href="#b" patternTransform="matrix(.014142 -.014142 -.014142 -.014142 -16028 -559.29)">
    </pattern>
    
    <path class="st5" d="m87.5 87.5v23.1c0 3.5-2.6 6.4-6.1 6.8-21.7 2.6-42.3 0-50.3-1.2-2.1-0.3-3.6-2.1-3.6-4.2 0-5.6 0.1-16.7 0.5-24.4h23.5"/>
    
    </svg>

Есть идеи почему?

Я нашел этот вопрос , но он действительно ничего не изменил.

Answer 1

Я удалил шаблон #a и теперь он работает и в FF

 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" enable-background="new 0 0 120 120" version="1.1" viewBox="0 70 120 65" xml:space="preserve">
    <style type="text/css">
    	.st0{fill:none;}
    	.st1{opacity:0.48;}
    	.st2{fill:#FFF99A;}
    	.st5{fill:url(#b);stroke:#007BFF;stroke-width:0.5;stroke-miterlimit:10;}
    </style>
    <pattern id="b" y="120" width="200" height="200" overflow="visible" patternUnits="userSpaceOnUse" viewBox="0 0 200 200" patternTransform="matrix(.014142 -.014142 -.014142 -.014142 -16028 -559.29)">
    		<rect class="st0"  width="200" height="200"/>
    		<rect class="st0"  width="200" height="200"/>
    		<g class="st1">
    			<rect class="st2" y="100" width="200" height="100"/>
    		</g>
    		<g class="st1">
    			<rect class="st2" x="100"  width="100" height="200"/>
    		</g>
    </pattern>
    	
    
    
    <path class="st5" d="m87.5 87.5v23.1c0 3.5-2.6 6.4-6.1 6.8-21.7 2.6-42.3 0-50.3-1.2-2.1-0.3-3.6-2.1-3.6-4.2 0-5.6 0.1-16.7 0.5-24.4h23.5"/>
    
    </svg>